Add box layout widget

This commit is contained in:
Jarrod Doyle 2024-04-10 13:43:50 +01:00
parent c67f6efb32
commit 61f20f228e
Signed by: Jayrude
GPG Key ID: 38B57B16E7C0ADF7
3 changed files with 21 additions and 9 deletions

View File

@ -1,6 +1,6 @@
import { Metrics, DarkPalette } from "theme.slint"; import { Metrics, DarkPalette } from "theme.slint";
import { Panel } from "widgets/panel.slint"; import { Panel } from "widgets/panel.slint";
import { HorizontalBox, VerticalBox } from "widgets/layout.slint"; import { Box, HorizontalBox, VerticalBox } from "widgets/layout.slint";
export component ObjectToolPanel inherits VerticalBox { export component ObjectToolPanel inherits VerticalBox {
@ -98,7 +98,7 @@ export component ObjectToolPanel inherits VerticalBox {
text: @tr("Name:"); text: @tr("Name:");
} }
HorizontalBox { Box {
j-padding: 0px; j-padding: 0px;
Text { Text {
@ -110,14 +110,14 @@ export component ObjectToolPanel inherits VerticalBox {
} }
} }
HorizontalBox { Box {
width: Metrics.size-md; width: Metrics.size-md;
j-elevation: 3; j-elevation: 3;
Rectangle { } Rectangle { }
} }
HorizontalBox { Box {
width: Metrics.size-md; width: Metrics.size-md;
j-elevation: 3; j-elevation: 3;
@ -125,7 +125,7 @@ export component ObjectToolPanel inherits VerticalBox {
} }
} }
VerticalBox { Box {
Text { Text {
color: DarkPalette.text[4]; color: DarkPalette.text[4];
font-size: Metrics.font-lg; font-size: Metrics.font-lg;

View File

@ -1,13 +1,12 @@
import { Metrics, DarkPalette } from "theme.slint"; import { Metrics, DarkPalette } from "theme.slint";
import { Button } from "std-widgets.slint"; import { Button } from "std-widgets.slint";
import { HorizontalSeparator } from "widgets/separator.slint"; import { HorizontalSeparator } from "widgets/separator.slint";
import { VerticalBox } from "widgets/layout.slint"; import { Box, VerticalBox } from "widgets/layout.slint";
component ToolBarItem inherits Rectangle { component ToolBarItem inherits Box {
width: Metrics.size-lg; width: Metrics.size-lg;
height: Metrics.size-lg; height: Metrics.size-lg;
border-radius: Metrics.radius-md; j-elevation: 2;
background: DarkPalette.background[2];
} }
export component ToolBar inherits VerticalBox { export component ToolBar inherits VerticalBox {

View File

@ -45,3 +45,16 @@ export component VerticalBox inherits Rectangle {
@children @children
} }
} }
export component Box inherits Rectangle {
in property <int> j-elevation: 1;
in property <length> j-rounding: Metrics.radius-md;
in property <length> j-padding: Metrics.padding-md;
background: DarkPalette.background[j-elevation];
border-radius: j-rounding;
clip: true;
padding: j-padding;
@children
}