Commit fe4da17f authored by Yavor Yankov's avatar Yavor Yankov
Browse files

Binding example

parents
.build/
.cache/
build/
.uno/
.DS_Store
<Rectangle ux:Class="Rectanglez" Width="35" Height="35" CornerRadius="25">
<string ux:Property="Value"/>
<SolidColor ux:Name="buttonBg" Color="#fff"/>
<Stroke Width="1" ux:Name="buttonStroke" Brush="#F4F4F4"/>
<WhileHovering>
<Change buttonStroke.Width="1" Duration="0.3" Easing="CircularIn"/>
<Change buttonStroke.Color="#fbe4d4" Duration="0.3" Easing="CircularIn"/>
</WhileHovering>
<Selectable Value="{ReadProperty Value}" />
<Clicked>
<ToggleSelection />
</Clicked>
<WhileSelected>
<Change buttonBg.Color="#FC8535" Duration=".3"/>
</WhileSelected>
</Rectangle>
<Button ux:Class="RoundButton" ClipToBounds="false" Margin="0,0,0,4" Padding="20,7,20,7" Name="self">
<string ux:Property="LabelA"/>
<Text ux:Name="buttonText" TextColor="#666666" Value="{Property self.Text}" TextAlignment="Center"/>
<Rectangle Layer="Background" CornerRadius="25">
<SolidColor ux:Name="buttonBg" Color="#fff"/>
<Stroke Width="1" ux:Name="buttonStroke" Brush="#F4F4F4"/>
</Rectangle>
<WhileHovering>
<Change buttonStroke.Width="1" Duration="0.3" Easing="CircularIn"/>
<Change buttonStroke.Color="#fbe4d4" Duration="0.3" Easing="CircularIn"/>
</WhileHovering>
<Selectable Value="{ReadProperty LabelA}" />
<!-- <Selectable Value="{Property self.LabelA}" /> -->
<Clicked>
<ToggleSelection />
</Clicked>
<WhileSelected>
<Change buttonBg.Color="#FC8535" Duration=".3"/>
</WhileSelected>
</Button>
<App>
<Router ux:Name="router" />
<ClientPanel>
<Navigator DefaultPath="page">
<Page1 ux:Template="page" router="router" />
</Navigator>
</ClientPanel>
</App>
let buttons = [
{id: 1, name: 'Button1'},
{id: 2, name: 'Button2'},
{id: 3, name: 'Button3'},
{id: 4, name: 'Button4'},
{id: 5, name: 'Button5'},
{id: 6, name: 'Button6'},
{id: 7, name: 'Button7'},
{id: 8, name: 'Button8'}
];
module.exports = {
buttons: buttons,
}
<Page ux:Class="Page1">
<Router ux:Dependency="router" />
<JavaScript File="Page1.js" />
<DockPanel>
<ScrollView>
<StackPanel Margin="10, 10, 10, 10" Padding="0, 100, 0, 0">
<Selection />
<WrapPanel Alignment="HorizontalCenter" RowAlignment="Center">
<Each Items="{buttons}">
<RoundButton Text="{name}" LabelA="{name}" Margin="10, 10, 10, 10"></RoundButton>
</Each>
</WrapPanel>
<Rectanglez Value="boo"></Rectanglez>
</StackPanel>
</ScrollView>
</DockPanel>
</Page>
{
"RootNamespace":"",
"Packages": [
"Fuse",
"FuseJS"
],
"Includes": [
"*",
"Pages/*.js:Bundle"
]
}
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment