rizary/Ziya
1
Fork 0
Code Pull requests Activity

fixing the layout and separate the column widgets into new file

Browse source
This commit is contained in:
rizary 2025-07-08 15:28:09 +07:00
parent 8c49495865
commit e5c930c9ff
Signed by untrusted user who does not match committer: rizary
GPG key ID: 2CE8D69D02F1CEB5
5 changed files with 62 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
ui/pages/hunting-ground/ui/hunting-ground-page.slint
View file

@ -4,7 +4,7 @@ import { Palette, ScrollView } from "std-widgets.slint";
import { NewTokenUiData, CexUpdatedUiData, MaxDepthReachedUiData } from "../../../shared/types/token.slint";
// Import the new token column widgets
import { NewTokensColumn, CexTokensColumn, AnalysisCompleteColumn } from "../../../widgets/token-column/ui/mod.slint";
import { NewTokensColumn, CexTokensColumn, AnalysisCompleteColumn } from "../../../widgets/hunting-ground-column/ui/mod.slint";
// Hunting Ground Page Component
export component HuntingGroundPage {
@ -19,13 +19,10 @@ export component HuntingGroundPage {
callback clear-cex-tokens();
callback clear-analysis-tokens();
Rectangle {
background: Palette.background;
VerticalLayout {
alignment: start; // Explicitly align to top
padding: 16px; // Reduced from 24px
spacing: 16px; // Reduced from 24px
padding: 16px;
spacing: 16px;
// Header with refresh button
HorizontalLayout {
@ -39,36 +36,34 @@ export component HuntingGroundPage {
}
}
// Three columns layout with fixed widths to prevent binding loops
// Three columns layout using proper Slint responsive layout
HorizontalLayout {
spacing: 16px;
padding: 8px;
height: 600px; // Fixed height to prevent overflow
min-height: 500px; // Minimum height, but allows growing
alignment: stretch; // Stretch children to fill available space
// Column 1: New Tokens (fixed width)
// Column 1: New Tokens (1/3 responsive width)
NewTokensColumn {
width: 350px; // Fixed width instead of calculated
height: 100%;
horizontal-stretch: 1; // Equal stretch factor for 1/3 width
tokens: root.new-tokens;
clear-tokens => {
root.clear-new-tokens();
}
}
// Column 2: CEX Analyst (fixed width)
// Column 2: CEX Analyst (1/3 responsive width)
CexTokensColumn {
width: 350px; // Fixed width instead of calculated
height: 100%;
horizontal-stretch: 1; // Equal stretch factor for 1/3 width
tokens: root.cex-tokens;
clear-tokens => {
root.clear-cex-tokens();
}
}
// Column 3: Analysis Complete (fixed width)
// Column 3: Analysis Complete (1/3 responsive width)
AnalysisCompleteColumn {
width: 350px; // Fixed width instead of calculated
height: 100%;
horizontal-stretch: 1; // Equal stretch factor for 1/3 width
tokens: root.analysis-tokens;
clear-tokens => {
root.clear-analysis-tokens();
@ -76,5 +71,4 @@ export component HuntingGroundPage {
}
}
}
}
}

11
ui/widgets/token-column/ui/analysis-complete-column.slint → ui/widgets/hunting-ground-column/ui/analysis-complete-column.slint
View file

@ -2,8 +2,9 @@ import { Palette, ScrollView } from "std-widgets.slint";
import { MaxDepthReachedUiData } from "../../../shared/types/token.slint";
export component AnalysisCompleteColumn {
width: 100%; // Will be constrained by parent
height: 100%;
// Responsive properties - no fixed width/height
vertical-stretch: 1; // Allow vertical stretching
min-width: 200px; // Minimum width to maintain readability
in property <[MaxDepthReachedUiData]> tokens: [];
callback clear-tokens();
@ -13,8 +14,6 @@ export component AnalysisCompleteColumn {
border-radius: 12px;
border-width: 1px;
border-color: Palette.border;
width: 100%;
height: 100%;
VerticalLayout {
spacing: 0px;
@ -63,7 +62,7 @@ export component AnalysisCompleteColumn {
// Scrollable content area
ScrollView {
height: parent.height - 48px;
vertical-stretch: 1; // Take remaining space
VerticalLayout {
spacing: 8px;
@ -129,6 +128,7 @@ export component AnalysisCompleteColumn {
VerticalLayout {
spacing: 6px;
alignment: start;
horizontal-stretch: 1; // Take remaining space
// Name and completion status
HorizontalLayout {
@ -141,6 +141,7 @@ export component AnalysisCompleteColumn {
font-size: 14px;
font-weight: 600;
vertical-alignment: center;
horizontal-stretch: 1; // Allow text to wrap/expand
}
Rectangle {

11
ui/widgets/token-column/ui/cex-tokens-column.slint → ui/widgets/hunting-ground-column/ui/cex-tokens-column.slint
View file

@ -2,8 +2,9 @@ import { Palette, ScrollView } from "std-widgets.slint";
import { CexUpdatedUiData } from "../../../shared/types/token.slint";
export component CexTokensColumn {
width: 100%; // Will be constrained by parent
height: 100%;
// Responsive properties - no fixed width/height
vertical-stretch: 1; // Allow vertical stretching
min-width: 200px; // Minimum width to maintain readability
in property <[CexUpdatedUiData]> tokens: [];
callback clear-tokens();
@ -13,8 +14,6 @@ export component CexTokensColumn {
border-radius: 12px;
border-width: 1px;
border-color: Palette.border;
width: 100%;
height: 100%;
VerticalLayout {
spacing: 0px;
@ -63,7 +62,7 @@ export component CexTokensColumn {
// Scrollable content area
ScrollView {
height: parent.height - 48px;
vertical-stretch: 1; // Take remaining space
VerticalLayout {
spacing: 8px;
@ -129,6 +128,7 @@ export component CexTokensColumn {
VerticalLayout {
spacing: 6px;
alignment: start;
horizontal-stretch: 1; // Take remaining space
// Name and CEX info
HorizontalLayout {
@ -141,6 +141,7 @@ export component CexTokensColumn {
font-size: 14px;
font-weight: 600;
vertical-alignment: center;
horizontal-stretch: 1; // Allow text to wrap/expand
}
Rectangle {

2
ui/widgets/token-column/ui/mod.slint → ui/widgets/hunting-ground-column/ui/mod.slint
View file

@ -1,4 +1,4 @@
// Token Column Widgets Module
// Hunting Ground Column Widgets Module
// Following Feature-Sliced Design - widgets layer
export { NewTokensColumn } from "new-tokens-column.slint";

11
ui/widgets/token-column/ui/new-tokens-column.slint → ui/widgets/hunting-ground-column/ui/new-tokens-column.slint
View file

@ -2,8 +2,9 @@ import { Palette, ScrollView } from "std-widgets.slint";
import { NewTokenUiData } from "../../../shared/types/token.slint";
export component NewTokensColumn {
width: 100%; // Will be constrained by parent
height: 100%;
// Responsive properties - no fixed width/height
vertical-stretch: 1; // Allow vertical stretching
min-width: 200px; // Minimum width to maintain readability
in property <[NewTokenUiData]> tokens: [];
callback clear-tokens();
@ -13,8 +14,6 @@ export component NewTokensColumn {
border-radius: 12px;
border-width: 1px;
border-color: Palette.border;
width: 100%;
height: 100%;
VerticalLayout {
spacing: 0px;
@ -63,7 +62,7 @@ export component NewTokensColumn {
// Scrollable content area
ScrollView {
height: parent.height - 48px;
vertical-stretch: 1; // Take remaining space
VerticalLayout {
spacing: 8px;
@ -129,6 +128,7 @@ export component NewTokensColumn {
VerticalLayout {
spacing: 6px;
alignment: start;
horizontal-stretch: 1; // Take remaining space
// Name and symbol
HorizontalLayout {
@ -141,6 +141,7 @@ export component NewTokensColumn {
font-size: 14px;
font-weight: 600;
vertical-alignment: center;
horizontal-stretch: 1; // Allow text to wrap/expand
}
if token.symbol != "": Rectangle {