list item

8 files changed, 23 insertions, 204 deletions

diff --git a/Samples/common/ui/Interfaces/CheckBox2.imlt b/Samples/common/ui/Interfaces/CheckBox2.imlt
index c2bfe8da..84ec22b3 100644
--- a/Samples/common/ui/Interfaces/CheckBox2.imlt
+++ b/Samples/common/ui/Interfaces/CheckBox2.imlt
@@ -1,5 +1,5 @@
-<Label Font="{./Font}" Text="{./Caption}" Height="{./HeightPolicy}" Width="{./WidthPolicy}"
-	Margin="3"
+<Label Font="{./Font}" Text="{./Caption}" Width="Stretched"
+	Margin="5"
 	Background="{./Background}"
 	Foreground="DimGrey"
 	TextAlignment="Center"
diff --git a/Samples/common/ui/Interfaces/Divers/classBindings.crow b/Samples/common/ui/Interfaces/Divers/classBindings.crow
new file mode 100644
index 00000000..72144e8e
--- /dev/null
+++ b/Samples/common/ui/Interfaces/Divers/classBindings.crow
@@ -0,0 +1,9 @@
+<VerticalStack Fit="true">
+	<VerticalStack DataSourceType="Crow.TestClass" DataSource="{TcInstance}" Margin="10" Background="Onyx" Fit="true">
+		<Label Text="{Prop1}"/>
+		<Label Text="{Prop2}"/>
+	</VerticalStack>
+	<HorizontalStack>
+		<Button Caption="Change Instance" MouseClick="tcInstance_ChangeInstance_MouseClick"/>
+	</HorizontalStack>
+</VerticalStack>
\ No newline at end of file
diff --git a/Samples/common/ui/Interfaces/Divers/dbglog.crow b/Samples/common/ui/Interfaces/Divers/dbglog.crow
deleted file mode 100644
index 16f6c35e..00000000
--- a/Samples/common/ui/Interfaces/Divers/dbglog.crow
+++ /dev/null
@@ -1,99 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<HorizontalStack>
-	<TreeView Width="20%" Data="{../dbv.Events}" SelectedItemChanged="onSelectedItemChanged"> 
-		<ItemTemplate Data="Events">
-			<Expandable Caption="{type}" MouseDoubleClick="/onClickForExpand" CacheEnabled="true" IsExpanded="{²IsExpanded}">
-				<Template>
-					<VerticalStack>
-						<Border CornerRadius="2" Margin="0" Height="Fit" MouseDoubleClick="./onClickForExpand"
-								Foreground="Transparent"
-								MouseEnter="{Foreground=DimGrey}"
-								MouseLeave="{Foreground=Transparent}">
-							<HorizontalStack Spacing="2" Background="Onyx">
-								<Image Margin="1" Width="9" Height="9" Focusable="true" MouseDown="./onClickForExpand"
-									Path="{./Image}"
-									Visible="{HasChildEvents}"
-									SvgSub="{./IsExpanded}"
-									MouseEnter="{Background=LightGrey}"
-									MouseLeave="{Background=Transparent}"/>
-								<Label Text="{./Caption}" Width="80" Font="mono, 8" />
-								<Label Text="{Duration}" Width="40" Font="mono, 8" TextAlignment="Center" Background="DimGrey"/>
-								<DbgEventWidget Event="{}" Tooltip="{/HoverEvent}" TicksPerPixel="200" Width="Fit" Height="5"/>
-							</HorizontalStack>
-						</Border>
-						<Container Name="Content" Visible="false"/>
-					</VerticalStack>
-				</Template>
-				<HorizontalStack Height="Fit">
-					<Widget Width="12" Height="10"/>
-					<VerticalStack Height="Fit" Name="ItemsContainer"/>
-				</HorizontalStack>
-			</Expandable>
-		</ItemTemplate>		
-		<ItemTemplate Data="Events" DataType="DbgWidgetEvent">
-			<Expandable Caption="{type}" MouseDoubleClick="/onClickForExpand" CacheEnabled="true" IsExpanded="{²IsExpanded}">
-				<Template>
-					<VerticalStack>
-						<Border CornerRadius="2" Margin="0" Height="Fit" MouseDoubleClick="./onClickForExpand"
-								Foreground="Transparent"
-								MouseEnter="{Foreground=DimGrey}"
-								MouseLeave="{Foreground=Transparent}">
-							<HorizontalStack Spacing="2" Background="Onyx">
-								<Image Margin="1" Width="9" Height="9" Focusable="true" MouseDown="./onClickForExpand"
-									Path="{./Image}"
-									Visible="{HasChildEvents}"
-									SvgSub="{./IsExpanded}"
-									MouseEnter="{Background=LightGrey}"
-									MouseLeave="{Background=Transparent}"/>
-								<Label Text="{./Caption}" Width="80" Font="mono, 8" />
-								<Label Text="{Duration}" Width="40" Font="mono, 8" TextAlignment="Center" Background="DimGrey"/>
-								<Label Text="{InstanceIndex}" Width="40" Font="mono, 8" TextAlignment="Center" Background="DimGrey"/>
-								<DbgEventWidget Event="{}" Tooltip="{/HoverEvent}" TicksPerPixel="200" Width="Fit" Height="5"/>
-							</HorizontalStack>
-						</Border>
-						<Container Name="Content" Visible="false"/>
-					</VerticalStack>
-				</Template>
-				<HorizontalStack Height="Fit">
-					<Widget Width="12" Height="10"/>
-					<VerticalStack Height="Fit" Name="ItemsContainer"/>
-				</HorizontalStack>
-			</Expandable>
-		</ItemTemplate>		
-	</TreeView>
-	<Splitter/>
-	<VerticalStack>
-		<DbgLogViewer Visible="true" Name="dbv" LogFile="debug.log" MouseWheelSpeed="10" Font="mono, 8"/>
-		<ScrollBar Style="HScrollBar" Maximum="{../dbv.MaxScrollX}" Value="{²../dbv.ScrollX}"/>
-		<HorizontalStack Height="Fit" DataSource="{../../dbv.CurrentWidget}">
-			<Label Text="{name}"/>
-			<Label Text="{listIndex}"/>
-			<Label Text="{instanceNum}"/>
-			<Label Text="{treeIndex}"/>
-			<Label Text="{yIndex}"/>
-			<Label Text="{xLevel}"/>
-		</HorizontalStack>
-		<ListBox Data="{RootEvents}" Height="100" DataSource="{../../dbv.CurrentWidget}">
-			<ItemTemplate>
-				<DbgEventWidget Height="10" Width="Fit" Event="{}" Tooltip="{/HoverEvent}" TicksPerPixel="100"/>
-			</ItemTemplate>
-			<Template>
-				<Wrapper Name="ItemsContainer" Spacing="2" Background="DarkGrey"/>
-			</Template>
-		</ListBox>	
-		<!--<DbgEventWidget Height="20" Width="Stretched" Event="{../../dbv.CurrentEvent}"/>-->
-		<VerticalStack DataSource="{../../dbv.CurrentEvent}">
-			<HorizontalStack>
-				<Label Text="{type}"/>
-				<Label Text="{begin}"/>
-				<Label Text="{end}"/>
-				<Label Text="{Duration}"/>
-			</HorizontalStack>
-			<ListBox Data="{events}" Height="100">
-				<ItemTemplate>
-					<DbgEventWidget Height="20" Width="Stretched" Event="{}"/>
-				</ItemTemplate>
-			</ListBox>
-		</VerticalStack>
-	</VerticalStack>
-</HorizontalStack>
\ No newline at end of file
diff --git a/Samples/common/ui/Interfaces/Divers/splitter0.crow b/Samples/common/ui/Interfaces/Divers/splitter0.crow
new file mode 100644
index 00000000..218ba621
--- /dev/null
+++ b/Samples/common/ui/Interfaces/Divers/splitter0.crow
@@ -0,0 +1,7 @@
+<HorizontalStack Margin="50">
+	<Widget Background="SeaGreen" Width="33%"/>
+	<Splitter/>
+	<Widget Background="SeaGreen" Width="33%"/>
+	<Splitter/>
+	<Widget Background="SeaGreen"/>
+</HorizontalStack>
diff --git a/Samples/common/ui/Interfaces/Splitter/1.crow b/Samples/common/ui/Interfaces/Splitter/1.crow
deleted file mode 100644
index 48c1ea1e..00000000
--- a/Samples/common/ui/Interfaces/Splitter/1.crow
+++ /dev/null
@@ -1,30 +0,0 @@
-<?xml version="1.0"?>
-<HorizontalStack Width="80%" Height="50%">
-	<Border Width="45%" CornerRadius="10" BorderWidth="1">
-		<VerticalStack>
-			<VerticalStack Height="45%">
-				<CheckBox Height="25%" IsChecked="false" Caption="Check 1" Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox Height="25%" IsChecked="false" Caption="Check 2"  Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox Height="25%" IsChecked="true" Caption="Check 3"  Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox Height="25%" IsChecked="false" Caption="Check 4" Background="hgradient|0:LimeGreen|1:Transparent"/>
-			</VerticalStack>
-			<Splitter Thickness="3"/>
-			<VerticalStack Height="45%">
-				<CheckBox Height="25%" IsChecked="false" Caption="Check 1" Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox Height="25%" IsChecked="false" Caption="Check 2"  Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox Height="25%" IsChecked="true" Caption="Check 3"  Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox Height="25%" IsChecked="false" Caption="Check 4" Background="hgradient|0:LimeGreen|1:Transparent"/>
-			</VerticalStack>
-		</VerticalStack>
-	</Border>
-	<Splitter Thickness="3"/>
-	<Border Width="45%" CornerRadius="10" BorderWidth="1">
-		<VerticalStack Width="50%" Height="50%" Background="DimGrey">
-			<RadioButton IsChecked="false" Caption="Choice 1" Background="hgradient|0:DarkRed|1:Transparent"/>
-			<RadioButton IsChecked="false" Caption="Choice 2"  Background="hgradient|0:DarkRed|1:Transparent"/>
-			<RadioButton IsChecked="true" Caption="Choice 3"  Background="hgradient|0:DarkRed|1:Transparent"/>
-			<RadioButton IsChecked="false" Caption="Choice 4" Background="hgradient|0:DarkRed|1:Transparent"/>
-		</VerticalStack>
-	</Border>
-	<Splitter Thickness="3"/>
-</HorizontalStack>
diff --git a/Samples/common/ui/Interfaces/Splitter/3.crow b/Samples/common/ui/Interfaces/Splitter/3.crow
deleted file mode 100644
index 9a288963..00000000
--- a/Samples/common/ui/Interfaces/Splitter/3.crow
+++ /dev/null
@@ -1,44 +0,0 @@
-<?xml version="1.0"?>
-<VerticalStack Fit="true">
-	<Widget CornerRadius="5" Height="10" Width="600" Background="vgradient|0:Transparent|0.5:White|1:Transparent"/>
-	<HorizontalStack Fit="true" HorizontalAlignment="Left">
-		<Border Fit="true" CornerRadius="10" BorderWidth="1">
-			<VerticalStack Margin="10">
-				<CheckBox IsChecked="false" Caption="Check 1" Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox IsChecked="false" Caption="Check 2"  Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox IsChecked="true" Caption="Check 3"  Background="hgradient|0:LimeGreen|1:Transparent"/>
-				<CheckBox IsChecked="false" Caption="Check 4" Background="hgradient|0:LimeGreen|1:Transparent"/>
-			</VerticalStack>
-		</Border>
-		<Splitter/>
-		<Border Fit="true" CornerRadius="10" BorderWidth="1">
-			<VerticalStack Margin="10">
-				<RadioButton IsChecked="false" Caption="Choice 1" Background="hgradient|0:DarkRed|1:Transparent"/>
-				<Splitter/>
-				<RadioButton Width="Stretched" IsChecked="false" Caption="Choice 2"  Background="hgradient|0:DarkRed|1:Transparent"/>
-				<RadioButton IsChecked="true" Caption="Choice 3"  Background="hgradient|0:DarkRed|1:Transparent"/>
-				<RadioButton IsChecked="false" Caption="Choice 4" Background="hgradient|0:DarkRed|1:Transparent"/>
-			</VerticalStack>
-		</Border>
-		<Splitter Thickness="3" />
-		<Border Fit="true" CornerRadius="10" BorderWidth="1" MaximumSize="150,150" MinimumSize="50,50">
-			<VerticalStack Margin="10">
-				<Label Text="label 1" Background="hgradient|0:Blue|1:Transparent"/>
-				<Label Text="label 2" Background="hgradient|0:Blue|1:Transparent"/>
-				<Label Text="label 3" Background="hgradient|0:Blue|1:Transparent"/>
-				<Label Text="label 4" Width="Stretched" Background="hgradient|0:Blue|1:Transparent"/>
-			</VerticalStack>
-		</Border>
-		<Splitter/>
-		<Border Fit="true" CornerRadius="10" BorderWidth="1">
-			<VerticalStack Margin="10">
-				<Button Caption="Button 1" Background="hgradient|0:Red|1:DarkRed" CornerRadius="5"/>
-				<Button Caption="Button 2"  Background="hgradient|0:Green|1:Blue" CornerRadius="3"/>
-				<Button Caption="Button 3"  Background="hgradient|0:DarkRed|1:Transparent" CornerRadius="0"/>
-				<Button Caption="Button 4" Background="hgradient|0:DarkRed|1:Transparent" CornerRadius="8"/>
-			</VerticalStack>
-		</Border>
-		<Splitter/>
-	</HorizontalStack>
-	<Widget CornerRadius="5" Height="10" Width="600" Background="vgradient|0:Transparent|0.5:White|1:Transparent"/>
-</VerticalStack>
\ No newline at end of file
diff --git a/Samples/common/ui/Interfaces/TabItem.template b/Samples/common/ui/Interfaces/TabItem.template
deleted file mode 100644
index fd0f310d..00000000
--- a/Samples/common/ui/Interfaces/TabItem.template
+++ /dev/null
@@ -1,24 +0,0 @@
-<?xml version="1.0"?>
-<GenericStack Orientation="Vertical" Spacing="0"
-		Background="{./Background}"
-		MouseEnter="{/caption.Foreground=White}"
-		MouseLeave="{/caption.Foreground=Grey}">
-	<HorizontalStack Left="{./TabOffset}"
-		Name="TabTitle"
-		HorizontalAlignment="Left"
-		Height="{./TabHeight}"
-		Width="{./TabWidth}">
-		<Label Name="caption" Text="{./Caption}" Foreground="Grey" Width="Stretched"/>
-		<Label Text="{./ViewIndex}" Foreground="Green"/>
-		<Label Text="{./TabOffset}" Foreground="Red"/>
-		<Border CornerRadius="5" BorderWidth="1" Foreground="Transparent"  Height="12" Width="12"
-					MouseEnter="{Foreground=White}" MouseLeave="{Foreground=Transparent}">
-			<Image Focusable="true" Name="Image" Margin="0" Width="Stretched" Height="Stretched" Path="#Crow.Icons.exit2.svg"
-				 MouseClick="./butCloseTabClick"/>
-		</Border>
-	</HorizontalStack>
-	<Container Margin="20">
-		<Container Background="DimGrey" Name="Content"/>
-	</Container>
-</GenericStack>
-
diff --git a/Samples/common/ui/Interfaces/colorItem.crow b/Samples/common/ui/Interfaces/colorItem.crow
index 06169f2b..1def3811 100644
--- a/Samples/common/ui/Interfaces/colorItem.crow
+++ b/Samples/common/ui/Interfaces/colorItem.crow
@@ -1,10 +1,10 @@
 <?xml version="1.0"?>
-<Border Foreground="Transparent" Focusable="true" HorizontalAlignment="Left" Height="Fit">
-	<HorizontalStack Margin="1" Spacing="3"
-				MouseEnter="{Background=LightBlue}"
-				MouseLeave="{Background=Transparent}">
+<ListItem HorizontalAlignment="Left" Height="Fit"
+		Selected = "{Background=${ControlHighlight}}"
+		Unselected = "{Background=Transparent}">
+	<HorizontalStack Margin="1" Spacing="3">
 		<Widget Height="12" Width="20" Background="{}" Margin="0" CornerRadius="5"/>
 		<Label  Text="{}" Margin="0" Width="Stretched"/>
 	</HorizontalStack>
-</Border>
+</ListItem>