Skip to content

Commit

Permalink
Merge pull request #813 from morning4coffe-dev/dev/doti/options-impro…
Browse files Browse the repository at this point in the history 
…vements

chore: Update TreeView to use Options
  • Loading branch information
@MartinZikmund
MartinZikmund authored Jul 16, 2023
2 parents b87de2f + a825208 commit 55138fb
Show file tree
Hide file tree
Showing 3 changed files with 57 additions and 110 deletions.
18 changes: 18 additions & 0 deletions Uno.Gallery/Uno.Gallery.Shared/Extensions/XamlDisplayExtensions.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -382,6 +382,8 @@ protected override string PostprocessXaml(string xaml)
{
xaml = RemoveXmlns(xaml);

xaml = RemoveOptions(xaml);

return xaml;
}

Expand All @@ -400,6 +402,22 @@ private static string RemoveXmlns(string xaml)
});
}

private static string RemoveOptions(string xaml)
{
string startString = "<smtx:XamlDisplayExtensions.Options";
string endString = "</smtx:XamlDisplayExtensions.Options>";

int startIndex = xaml.IndexOf(startString);
int endIndex = xaml.IndexOf(endString);

if (startIndex == -1 || endIndex == -1)
{
return xaml;
}

return xaml.Substring(0, startIndex) + xaml.Substring(endIndex + endString.Length);
}

private class PrettyXmlWriter : NiceXmlWriter
{
Func<IReadOnlyCollection<(string Prefix, string LocalName, string NS)>, bool> _noopInnerCallImpl;
Expand Down
130 changes: 35 additions & 95 deletions Uno.Gallery/Uno.Gallery.UWP/Views/SamplePages/TreeViewSamplePage.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,62 +66,10 @@ Items = new ObservableCollection<TreeItem>()
</smtx:XamlDisplay>

<smtx:XamlDisplay UniqueKey="TreeViewSamplePage_Advanced"
smtx:XamlDisplayExtensions.IgnorePath="XamlDisplay\UserControl\Grid\Border"
smtx:XamlDisplayExtensions.IgnorePath="XamlDisplay"
smtx:XamlDisplayExtensions.Header="Customized TreeView with options">
<UserControl>
<Grid HorizontalAlignment="Stretch"
RowSpacing="8">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>

<VisualStateManager.VisualStateGroups>
<VisualStateGroup>
<VisualState x:Name="WideState">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="1060" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="treeView.(Grid.Column)"
Value="0" />
<Setter Target="sideBar.(Grid.Column)"
Value="1" />
<Setter Target="sideBar.(Grid.RowSpan)"
Value="2" />
<Setter Target="treeView.(Grid.RowSpan)"
Value="2" />
<Setter Target="sideBar.HorizontalAlignment"
Value="Right" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="NarrowState">
<VisualState.StateTriggers>
<AdaptiveTrigger MinWindowWidth="0" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="treeView.(Grid.Row)"
Value="0" />
<Setter Target="sideBar.(Grid.Row)"
Value="1" />
<Setter Target="sideBar.(Grid.ColumnSpan)"
Value="2" />
<Setter Target="treeView.(Grid.ColumnSpan)"
Value="2" />
<Setter Target="sideBar.HorizontalAlignment"
Value="Stretch" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>

<Border x:Name="treeView">
<!--
<!--
Folders = new ObservableCollection<TreeItem>()
{
new TreeItem("Documents")
Expand Down Expand Up @@ -158,48 +106,40 @@ Folders = new ObservableCollection<TreeItem>()
}
};
-->
<muxc:TreeView ItemsSource="{Binding Data.Folders, Mode=TwoWay}"
CanDragItems="{Binding Data.CanDragItems}"
AllowDrop="{Binding Data.AllowDrop}"
SelectionMode="{Binding Data.SelectionMode}">
<muxc:TreeView.ItemTemplate>
<DataTemplate x:DataType="data:TreeItem">
<muxc:TreeViewItem ItemsSource="{x:Bind Children}"
IsExpanded="True">
<StackPanel Orientation="Horizontal"
Spacing="8">
<FontIcon Glyph="{x:Bind Glyph}" />
<TextBlock Text="{x:Bind Name}"
VerticalAlignment="Center" />
</StackPanel>
</muxc:TreeViewItem>
</DataTemplate>
</muxc:TreeView.ItemTemplate>
</muxc:TreeView>
</Border>

<Border x:Name="sideBar"
HorizontalAlignment="Right"
CornerRadius="8"
Padding="16"
MinWidth="180"
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}">

<muxc:TreeView ItemsSource="{Binding Data.Folders, Mode=TwoWay}"
CanDragItems="{Binding Data.CanDragItems}"
AllowDrop="{Binding Data.AllowDrop}"
SelectionMode="{Binding Data.SelectionMode}">
<muxc:TreeView.ItemTemplate>
<DataTemplate x:DataType="data:TreeItem">
<muxc:TreeViewItem ItemsSource="{x:Bind Children}"
IsExpanded="True">
<StackPanel Orientation="Horizontal"
Spacing="8">
<FontIcon Glyph="{x:Bind Glyph}" />
<TextBlock Text="{x:Bind Name}"
VerticalAlignment="Center" />
</StackPanel>
</muxc:TreeViewItem>
</DataTemplate>
</muxc:TreeView.ItemTemplate>
</muxc:TreeView>

<StackPanel Spacing="4">
<CheckBox Content="CanDragItems"
IsChecked="{Binding Data.CanDragItems, Mode=TwoWay}" />
<CheckBox Content="AllowDrop"
IsChecked="{Binding Data.AllowDrop, Mode=TwoWay}" />
<ComboBox Header="SelectionMode"
SelectedItem="{Binding Data.SelectionMode, Mode=TwoWay}">
<x:String>None</x:String>
<x:String>Single</x:String>
<x:String>Multiple</x:String>
</ComboBox>
</StackPanel>
</Border>
</Grid>
</UserControl>
<smtx:XamlDisplayExtensions.Options>
<StackPanel Spacing="4">
<CheckBox Content="CanDragItems"
IsChecked="{Binding Data.CanDragItems, Mode=TwoWay}" />
<CheckBox Content="AllowDrop"
IsChecked="{Binding Data.AllowDrop, Mode=TwoWay}" />
<ComboBox Header="SelectionMode"
SelectedItem="{Binding Data.SelectionMode, Mode=TwoWay}">
<x:String>None</x:String>
<x:String>Single</x:String>
<x:String>Multiple</x:String>
</ComboBox>
</StackPanel>
</smtx:XamlDisplayExtensions.Options>
</smtx:XamlDisplay>
</StackPanel>
</DataTemplate>
Expand Down
19 changes: 4 additions & 15 deletions Uno.Gallery/Uno.Gallery.UWP/Views/Styles/XamlDisplay.xaml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,22 +56,12 @@
<AdaptiveTrigger MinWindowWidth="970" />
</VisualState.StateTriggers>
<VisualState.Setters>
<Setter Target="MainContent.(Grid.Column)"
Value="0" />
<Setter Target="Options.(Grid.Column)"
Value="1" />
<Setter Target="Options.(Grid.RowSpan)"
Value="2" />
<Setter Target="MainContent.(Grid.RowSpan)"
Value="2" />
<Setter Target="Options.(Grid.Row)"
Value="0" />
<Setter Target="Options.HorizontalAlignment"
Value="Right" />
<Setter Target="OptionsPresenter.HorizontalAlignment"
Value="Stretch" />
<Setter Target="OptionsPresenter.(Grid.ColumnSpan)"
Value="1" />
<Setter Target="OptionsPresenter.(Grid.ColumnSpan)"
Value="1" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
Expand All @@ -89,23 +79,22 @@

<!-- Content -->
<ContentPresenter x:Name="MainContent"
Grid.ColumnSpan="2"
Padding="16"
Content="{TemplateBinding Content}" />

<!-- Options -->
<Border x:Name="Options"
Grid.Row="1"
Grid.Column="0"
Grid.ColumnSpan="2"
CornerRadius="8"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="8"
Padding="16"
Visibility="{Binding Path=(smtx:XamlDisplayExtensions.Options), RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource NullToCollapsed}, FallbackValue=Collapsed}"
Background="{ThemeResource CardBackgroundFillColorDefaultBrush}">
<ContentPresenter x:Name="OptionsPresenter"
HorizontalAlignment="Left"
HorizontalAlignment="Stretch"
MinWidth="220"
Content="{Binding Path=(smtx:XamlDisplayExtensions.Options), RelativeSource={RelativeSource TemplatedParent}}" />
</Border>
Expand Down

0 comments on commit 55138fb

Please sign in to comment.