Fixed most issues with gui elements in unsafe areas

This commit is contained in:
Yousef Khadadeh 2026-04-27 00:42:25 +03:00
parent 33e4b57d79
commit 59a9d04d6f
5 changed files with 98 additions and 32 deletions

View file

@ -1,9 +1,28 @@
package com.erroratline0.infinipaint;
import android.os.Build;
import android.os.Bundle;
import android.util.Log;
import android.view.Window;
import android.view.WindowManager;
import org.libsdl.app.SDLActivity;
/**
* A sample wrapper class that just calls SDLActivity
*/
public class InfiniPaint extends SDLActivity { }
public class InfiniPaint extends SDLActivity {
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Window window = this.getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
window.setStatusBarColor(android.graphics.Color.TRANSPARENT);
window.setNavigationBarColor(android.graphics.Color.TRANSPARENT);
// Transparent navigation
//if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q)
// window.setNavigationBarContrastEnforced(false);
}
}

View file

@ -3,8 +3,11 @@
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.NoTitleBar.Fullscreen">
<!-- Customize your theme here. -->
<!--
For translucent status and navigation bars
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
-->
</style>
</resources>

View file

@ -75,7 +75,11 @@ void window_fill_side_bar(GUIManager& gui, const char* id, const WindowFillSideB
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.safeWindowRect.min.x()), .height = CLAY_SIZING_FIT(0)}}
}) {}
innerContent();
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.safeWindowRect.width()), .height = CLAY_SIZING_FIT(0)}}
}) {
innerContent();
}
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.windowSize.x() - gui.io.safeWindowRect.max.x()), .height = CLAY_SIZING_FIT(0)}}
}) {}
@ -101,7 +105,11 @@ void window_fill_side_bar(GUIManager& gui, const char* id, const WindowFillSideB
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.safeWindowRect.min.x()), .height = CLAY_SIZING_FIT(0)}}
}) {}
innerContent();
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.safeWindowRect.width()), .height = CLAY_SIZING_FIT(0)}}
}) {
innerContent();
}
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.windowSize.x() - gui.io.safeWindowRect.max.x()), .height = CLAY_SIZING_FIT(0)}}
}) {}
@ -133,7 +141,11 @@ void window_fill_side_bar(GUIManager& gui, const char* id, const WindowFillSideB
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIXED(gui.io.safeWindowRect.min.y())}}
}) {}
innerContent();
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIXED(gui.io.safeWindowRect.height())}}
}) {
innerContent();
}
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIXED(gui.io.windowSize.y() - gui.io.safeWindowRect.max.y())}}
}) {}
@ -159,7 +171,11 @@ void window_fill_side_bar(GUIManager& gui, const char* id, const WindowFillSideB
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIXED(gui.io.safeWindowRect.min.y())}}
}) {}
innerContent();
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIXED(gui.io.safeWindowRect.height())}}
}) {
innerContent();
}
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIT(0), .height = CLAY_SIZING_FIXED(gui.io.windowSize.y() - gui.io.safeWindowRect.max.y())}}
}) {}
@ -174,10 +190,29 @@ void window_fill_side_bar(GUIManager& gui, const char* id, const WindowFillSideB
});
}
void window_safe_area_layout(GUIManager& gui, const char* id, const std::function<void()>& innerContent) {
gui.element<LayoutElement>(id, [&] (LayoutElement* l, const Clay_ElementId& lId) {
innerContent();
});
void window_gap_side_bar(GUIManager& gui, const char* id, const WindowFillSideBarConfig::Direction& dir) {
switch(dir) {
case WindowFillSideBarConfig::Direction::TOP:
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIXED(gui.io.safeWindowRect.min.y())}}
}) {}
break;
case WindowFillSideBarConfig::Direction::BOTTOM:
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIXED(gui.io.windowSize.y() - gui.io.safeWindowRect.max.y())}}
}) {}
break;
case WindowFillSideBarConfig::Direction::LEFT:
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.safeWindowRect.min.x()), .height = CLAY_SIZING_GROW(0)}}
}) {}
break;
case WindowFillSideBarConfig::Direction::RIGHT:
CLAY_AUTO_ID({
.layout = {.sizing = {.width = CLAY_SIZING_FIXED(gui.io.windowSize.x() - gui.io.safeWindowRect.max.x()), .height = CLAY_SIZING_GROW(0)}}
}) {}
break;
}
}
}}

View file

@ -21,6 +21,6 @@ struct WindowFillSideBarConfig {
};
void window_fill_side_bar(GUIManager& gui, const char* id, const WindowFillSideBarConfig& config, const std::function<void()>& innerContent);
void window_safe_area_layout(GUIManager& gui, const char* id, const std::function<void()>& innerContent);
void window_gap_side_bar(GUIManager& gui, const char* id, const WindowFillSideBarConfig::Direction& dir);
}}

View file

@ -137,8 +137,6 @@ void FileSelectScreen::main_display() {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0)},
.padding = CLAY_PADDING_ALL(gui.io.theme->padding1),
.childGap = gui.io.theme->childGap1,
.childAlignment = { .x = CLAY_ALIGN_X_CENTER, .y = CLAY_ALIGN_Y_TOP },
.layoutDirection = CLAY_TOP_TO_BOTTOM,
},
@ -155,7 +153,13 @@ void FileSelectScreen::main_display() {
actionBarOpenAnim->animation_trigger_reverse();
title_bar();
}
window_safe_area_layout(gui, "center area element", [&] {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0)},
.layoutDirection = CLAY_LEFT_TO_RIGHT
},
}) {
window_gap_side_bar(gui, "main display left fill", WindowFillSideBarConfig::Direction::LEFT);
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_GROW(0)},
@ -178,7 +182,9 @@ void FileSelectScreen::main_display() {
break;
}
}
});
window_gap_side_bar(gui, "main display right fill", WindowFillSideBarConfig::Direction::RIGHT);
}
window_gap_side_bar(gui, "main display bottom fill", WindowFillSideBarConfig::Direction::BOTTOM);
menu_black_box();
}
edit_action_bar();
@ -199,7 +205,7 @@ void FileSelectScreen::create_file_button() {
.element = CLAY_ATTACH_POINT_RIGHT_BOTTOM,
.parent = CLAY_ATTACH_POINT_RIGHT_BOTTOM
},
.attachTo = CLAY_ATTACH_TO_ROOT
.attachTo = CLAY_ATTACH_TO_PARENT
}
}) {
svg_icon_button(gui, "add button", "data/icons/plus.svg", {
@ -369,22 +375,27 @@ void FileSelectScreen::edit_action_bar() {
void FileSelectScreen::edit_title_bar() {
auto& gui = main.g.gui;
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0)},
.childGap = gui.io.theme->childGap1,
.childAlignment = { .x = CLAY_ALIGN_X_LEFT, .y = CLAY_ALIGN_Y_CENTER },
.layoutDirection = CLAY_LEFT_TO_RIGHT,
}
}) {
svg_icon_button(gui, "close edit mode button", "data/icons/close.svg", {
.drawType = SelectableButton::DrawType::TRANSPARENT_ALL,
.onClick = [&] {
editMode = false;
window_fill_side_bar(gui, "edit top toolbar", {
.dir = WindowFillSideBarConfig::Direction::TOP,
.backgroundColor = gui.io.theme->backColor0
}, [&] {
CLAY_AUTO_ID({
.layout = {
.sizing = {.width = CLAY_SIZING_GROW(0), .height = CLAY_SIZING_FIT(0)},
.childGap = gui.io.theme->childGap1,
.childAlignment = { .x = CLAY_ALIGN_X_LEFT, .y = CLAY_ALIGN_Y_CENTER },
.layoutDirection = CLAY_LEFT_TO_RIGHT,
}
});
mutable_text_label(gui, "select files label", (numberOfSelectedEntries == 0) ? "Select files" : (std::to_string(numberOfSelectedEntries) + " selected"));
}
}) {
svg_icon_button(gui, "close edit mode button", "data/icons/close.svg", {
.drawType = SelectableButton::DrawType::TRANSPARENT_ALL,
.onClick = [&] {
editMode = false;
}
});
mutable_text_label(gui, "select files label", (numberOfSelectedEntries == 0) ? "Select files" : (std::to_string(numberOfSelectedEntries) + " selected"));
}
});
}
void FileSelectScreen::title_bar() {
@ -516,8 +527,6 @@ void FileSelectScreen::main_menu() {
CLAY(lId, {
.layout = {
.sizing = {.width = CLAY_SIZING_FIXED(300.0f * mainMenuOpenAnim->get_val()), .height = CLAY_SIZING_GROW(0)},
.padding = CLAY_PADDING_ALL(gui.io.theme->padding1),
.childGap = 0,
.layoutDirection = CLAY_TOP_TO_BOTTOM,
},
}) {