mirror of
https://github.com/coop-deluxe/sm64coopdx.git
synced 2025-10-30 08:01:01 +00:00
Chat UI redesigned
This commit is contained in:
parent
5c939c6ded
commit
5812dad90a
3 changed files with 55 additions and 18 deletions
|
|
@ -105,7 +105,7 @@ void sent_history_reset_navigation(ArrayList *arrayList) {
|
|||
bool djui_chat_box_render(struct DjuiBase* base) {
|
||||
struct DjuiChatBox* chatBox = (struct DjuiChatBox*)base;
|
||||
struct DjuiBase* ccBase = &chatBox->chatContainer->base;
|
||||
djui_base_set_size(ccBase, 1.0f, chatBox->base.comp.height - 32 - 8);
|
||||
djui_base_set_size(ccBase, 1.0f, chatBox->base.comp.height - 32 - 18);
|
||||
if (chatBox->scrolling) {
|
||||
f32 yMax = chatBox->chatContainer->base.elem.height - chatBox->chatFlow->base.height.value;
|
||||
f32 target = chatBox->chatFlow->base.y.value + (chatBox->scrollY - chatBox->chatFlow->base.y.value) * (configSmoothScrolling ? 0.5f : 1.f);
|
||||
|
|
@ -135,7 +135,12 @@ static void djui_chat_box_set_focus_style(void) {
|
|||
djui_interactable_set_input_focus(&gDjuiChatBox->chatInput->base);
|
||||
}
|
||||
|
||||
djui_base_set_color(&gDjuiChatBox->chatFlow->base, 0, 0, 0, gDjuiChatBoxFocus ? 128 : 0);
|
||||
bool hasMessages = (gDjuiChatBox->chatFlow->base.height.value > 2.0f);
|
||||
u8 alpha = 0;
|
||||
if (hasMessages) {
|
||||
alpha = gDjuiChatBoxFocus ? 160 : 0;
|
||||
}
|
||||
djui_base_set_color(&gDjuiChatBox->chatFlow->base, 0, 0, 0, alpha);
|
||||
}
|
||||
|
||||
static void djui_chat_box_input_enter(struct DjuiInputbox* chatInput) {
|
||||
|
|
@ -640,7 +645,7 @@ struct DjuiChatBox* djui_chat_box_create(void) {
|
|||
|
||||
djui_base_init(&gDjuiRoot->base, base, djui_chat_box_render, djui_chat_box_destroy);
|
||||
djui_base_set_size_type(base, DJUI_SVT_ABSOLUTE, DJUI_SVT_ABSOLUTE);
|
||||
djui_base_set_size(base, 600, 400);
|
||||
djui_base_set_size(base, 800, 400);
|
||||
djui_base_set_alignment(base, DJUI_HALIGN_LEFT, DJUI_VALIGN_BOTTOM);
|
||||
djui_base_set_color(base, 0, 0, 0, 0);
|
||||
djui_base_set_padding(base, 0, 8, 8, 8);
|
||||
|
|
@ -654,12 +659,12 @@ struct DjuiChatBox* djui_chat_box_create(void) {
|
|||
|
||||
struct DjuiFlowLayout* chatFlow = djui_flow_layout_create(ccBase);
|
||||
struct DjuiBase* cfBase = &chatFlow->base;
|
||||
djui_base_set_location(cfBase, 0, 0);
|
||||
djui_base_set_location(cfBase, 0, 8);
|
||||
djui_base_set_size_type(cfBase, DJUI_SVT_RELATIVE, DJUI_SVT_ABSOLUTE);
|
||||
djui_base_set_size(cfBase, 1.0f, 2);
|
||||
djui_base_set_color(cfBase, 0, 0, 0, 128);
|
||||
djui_base_set_padding(cfBase, 2, 2, 2, 2);
|
||||
djui_flow_layout_set_margin(chatFlow, 2);
|
||||
djui_base_set_color(cfBase, 0, 0, 0, 64);
|
||||
djui_base_set_padding(cfBase, 0, 2, 0, 2);
|
||||
djui_flow_layout_set_margin(chatFlow, 0);
|
||||
djui_flow_layout_set_flow_direction(chatFlow, DJUI_FLOW_DIR_UP);
|
||||
cfBase->addChildrenToHead = true;
|
||||
cfBase->abandonAfterChildRenderFail = true;
|
||||
|
|
@ -670,6 +675,9 @@ struct DjuiChatBox* djui_chat_box_create(void) {
|
|||
djui_base_set_size_type(ciBase, DJUI_SVT_RELATIVE, DJUI_SVT_ABSOLUTE);
|
||||
djui_base_set_size(ciBase, 1.0f, 32);
|
||||
djui_base_set_alignment(ciBase, DJUI_HALIGN_LEFT, DJUI_VALIGN_BOTTOM);
|
||||
djui_base_set_location(ciBase, 0, 0);
|
||||
djui_base_set_border_width(ciBase, 0);
|
||||
|
||||
djui_interactable_hook_key(&chatInput->base, djui_chat_box_input_on_key_down, djui_inputbox_on_key_up);
|
||||
djui_interactable_hook_text_input(&chatInput->base, djui_chat_box_input_on_text_input);
|
||||
djui_interactable_hook_text_editing(&chatInput->base, djui_chat_box_input_on_text_editing);
|
||||
|
|
|
|||
|
|
@ -24,14 +24,14 @@ static bool djui_chat_message_render(struct DjuiBase* base) {
|
|||
}
|
||||
|
||||
if (gDjuiChatBoxFocus) {
|
||||
djui_base_set_color(base, 0, 0, 0, 120);
|
||||
djui_base_set_color(base, 0, 0, 0, 0);
|
||||
djui_base_set_color(ctBase, 255, 255, 255, 255);
|
||||
djui_base_set_size_type(base, DJUI_SVT_RELATIVE, DJUI_SVT_ABSOLUTE);
|
||||
djui_base_set_size(base, 1.0f, chatMessage->base.height.value);
|
||||
} else if (f <= 0.1f) {
|
||||
return false;
|
||||
} else {
|
||||
djui_base_set_color(base, 0, 0, 0, 180 * f);
|
||||
djui_base_set_color(base, 0, 0, 0, 140 * f);
|
||||
djui_base_set_color(ctBase, 255, 255, 255, 255 * f);
|
||||
djui_base_set_size_type(base, DJUI_SVT_ABSOLUTE, DJUI_SVT_ABSOLUTE);
|
||||
djui_base_set_size(base, chatMessage->messageWidth, chatMessage->base.height.value);
|
||||
|
|
@ -76,8 +76,8 @@ void djui_chat_message_create(const char* message) {
|
|||
djui_base_init(&gDjuiChatBox->chatFlow->base, base, djui_chat_message_render, djui_chat_message_destroy);
|
||||
djui_base_set_size_type(base, DJUI_SVT_RELATIVE, DJUI_SVT_ABSOLUTE);
|
||||
djui_base_set_size(base, 1.0f, 0);
|
||||
djui_base_set_color(base, 0, 0, 0, 64);
|
||||
djui_base_set_padding(base, 2, 4, 2, 4);
|
||||
djui_base_set_color(base, 0, 0, 0, 0);
|
||||
djui_base_set_padding(base, 0, 4, 0, 4);
|
||||
djui_base_set_alignment(base, DJUI_HALIGN_LEFT, DJUI_VALIGN_BOTTOM);
|
||||
|
||||
f32 maxTextWidth = gDjuiChatBox->base.width.value - gDjuiChatBox->base.padding.left.value - gDjuiChatBox->base.padding.right.value - base->padding.left.value - base->padding.right.value;
|
||||
|
|
|
|||
|
|
@ -3,12 +3,13 @@
|
|||
#include "djui.h"
|
||||
#include "djui_unicode.h"
|
||||
#include "djui_hud_utils.h"
|
||||
#include "djui_chat_box.h"
|
||||
#include "pc/gfx/gfx_window_manager_api.h"
|
||||
#include "pc/pc_main.h"
|
||||
#include "game/segment2.h"
|
||||
#include "pc/controller/controller_keyboard.h"
|
||||
|
||||
#define DJUI_INPUTBOX_YOFF (-3)
|
||||
#define DJUI_INPUTBOX_YOFF (-2)
|
||||
#define DJUI_INPUTBOX_MAX_BLINK 50
|
||||
#define DJUI_INPUTBOX_MID_BLINK (DJUI_INPUTBOX_MAX_BLINK / 2)
|
||||
#define DJUI_INPUTBOX_CURSOR_WIDTH (2.0f / 32.0f)
|
||||
|
|
@ -20,6 +21,14 @@ static u8 sCursorBlink = 0;
|
|||
|
||||
static void djui_inputbox_update_style(struct DjuiBase* base) {
|
||||
struct DjuiInputbox* inputbox = (struct DjuiInputbox*)base;
|
||||
if (gDjuiChatBox != NULL && &gDjuiChatBox->chatInput->base == base) {
|
||||
djui_base_set_border_width(base, 0);
|
||||
djui_base_set_border_color(base, 0, 0, 0, 0);
|
||||
u8 alpha = gDjuiChatBoxFocus ? 200 : 150;
|
||||
djui_base_set_color(&inputbox->base, 0, 0, 0, alpha);
|
||||
return;
|
||||
}
|
||||
|
||||
if (!inputbox->base.enabled) {
|
||||
djui_base_set_border_color(base, 90, 90, 90, 255);
|
||||
djui_base_set_color(&inputbox->base, 140, 140, 140, 255);
|
||||
|
|
@ -503,6 +512,7 @@ static void djui_inputbox_render_preview_text(struct DjuiInputbox* inputbox) {
|
|||
|
||||
static void djui_inputbox_render_selection(struct DjuiInputbox* inputbox) {
|
||||
const struct DjuiFont* font = gDjuiFonts[configDjuiThemeFont == 0 ? FONT_NORMAL : FONT_ALIASED];
|
||||
bool isChatInput = (gDjuiChatBox != NULL && &gDjuiChatBox->chatInput->base == &inputbox->base);
|
||||
|
||||
// make selection well formed
|
||||
u16 selection[2] = { 0 };
|
||||
|
|
@ -540,7 +550,11 @@ static void djui_inputbox_render_selection(struct DjuiInputbox* inputbox) {
|
|||
if (sCursorBlink < DJUI_INPUTBOX_MID_BLINK && djui_interactable_is_input_focus(&inputbox->base)) {
|
||||
create_dl_translation_matrix(DJUI_MTX_PUSH, renderX - DJUI_INPUTBOX_CURSOR_WIDTH / 2.0f, -0.1f, 0);
|
||||
create_dl_scale_matrix(DJUI_MTX_NOPUSH, DJUI_INPUTBOX_CURSOR_WIDTH, 0.8f, 1.0f);
|
||||
gDPSetEnvColor(gDisplayListHead++, 0, 0, 0, 255);
|
||||
if (isChatInput) {
|
||||
gDPSetEnvColor(gDisplayListHead++, 255, 255, 255, 255);
|
||||
} else {
|
||||
gDPSetEnvColor(gDisplayListHead++, 0, 0, 0, 255);
|
||||
}
|
||||
gSPDisplayList(gDisplayListHead++, dl_djui_simple_rect);
|
||||
gSPPopMatrix(gDisplayListHead++, G_MTX_MODELVIEW);
|
||||
}
|
||||
|
|
@ -604,9 +618,15 @@ static bool djui_inputbox_render(struct DjuiBase* base) {
|
|||
const struct DjuiFont* font = gDjuiFonts[configDjuiThemeFont == 0 ? FONT_NORMAL : FONT_ALIASED];
|
||||
djui_rect_render(base);
|
||||
|
||||
// Shift the text away from the left side a tad
|
||||
comp->x += 2;
|
||||
comp->width -= 2;
|
||||
bool isChatInput = (gDjuiChatBox != NULL && &gDjuiChatBox->chatInput->base == base);
|
||||
if (isChatInput) {
|
||||
comp->x += 6;
|
||||
comp->y -= 1;
|
||||
comp->width -= 6;
|
||||
} else {
|
||||
comp->x += 2;
|
||||
comp->width -= 2;
|
||||
}
|
||||
|
||||
// shift the viewing window to keep the selection in view
|
||||
djui_inputbox_keep_selection_in_view(inputbox);
|
||||
|
|
@ -614,6 +634,12 @@ static bool djui_inputbox_render(struct DjuiBase* base) {
|
|||
// translate position
|
||||
f32 translatedX = comp->x + inputbox->viewX;
|
||||
f32 translatedY = comp->y + DJUI_INPUTBOX_YOFF;
|
||||
if (isChatInput) {
|
||||
f32 lineHeight = font->lineHeight * font->defaultFontScale;
|
||||
f32 innerHeight = comp->height - base->borderWidth.value * 2;
|
||||
f32 centerOffset = (innerHeight - lineHeight) * 0.5f;
|
||||
translatedY += fmaxf(centerOffset, 0.0f);
|
||||
}
|
||||
djui_gfx_position_translate(&translatedX, &translatedY);
|
||||
create_dl_translation_matrix(DJUI_MTX_PUSH, translatedX, translatedY, 0);
|
||||
|
||||
|
|
@ -633,8 +659,11 @@ static bool djui_inputbox_render(struct DjuiBase* base) {
|
|||
// render preview text (for tab completion) - after font setup
|
||||
// djui_inputbox_render_preview_text(inputbox);
|
||||
|
||||
// set color
|
||||
gDPSetEnvColor(gDisplayListHead++, inputbox->textColor.r, inputbox->textColor.g, inputbox->textColor.b, inputbox->textColor.a);
|
||||
if (isChatInput) {
|
||||
gDPSetEnvColor(gDisplayListHead++, 255, 255, 255, 255);
|
||||
} else {
|
||||
gDPSetEnvColor(gDisplayListHead++, inputbox->textColor.r, inputbox->textColor.g, inputbox->textColor.b, inputbox->textColor.a);
|
||||
}
|
||||
|
||||
// make selection well formed
|
||||
u16 selection[2] = { 0 };
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue