zhusenlin/Semi.Avalonia
1
0
Fork 0
mirror of https://gitcode.com/gh_mirrors/se/Semi.Avalonia synced 2026-04-30 21:23:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: redesign TabControlDemo.

Browse Source
This commit is contained in:
Zhang Dian
2025-03-31 10:30:31 +08:00
parent 8e7581fbe7
commit 09a070e3a9
2 changed files with 130 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

113
demo/Semi.Avalonia.Demo/Pages/TabControlDemo.axaml
View File

@@ -11,9 +11,38 @@
x:DataType="vm:TabControlDemoViewModel" x:DataType="vm:TabControlDemoViewModel"
mc:Ignorable="d"> mc:Ignorable="d">
<ScrollViewer> <ScrollViewer>
<StackPanel Spacing="20"> <StackPanel>
<Border
Theme="{StaticResource RadioButtonGroupBorder}"
Margin="8"
HorizontalAlignment="Left">
<ListBox
Name="place"
Theme="{StaticResource ButtonRadioGroupListBox}">
<Dock>Left</Dock>
<Dock>Bottom</Dock>
<Dock>Right</Dock>
<Dock>Top</Dock>
</ListBox>
</Border>
<TabControl Theme="{StaticResource LineTabControl}">
<TabItem Header="Default">
<StackPanel>
<StackPanel
Orientation="Horizontal"
Spacing="8"
Margin="8">
<TextBlock
VerticalAlignment="Center"
Text="ReverseSeparator" />
<ToggleSwitch
Name="reverse"
Theme="{StaticResource SimpleToggleSwitch}" />
</StackPanel>
<Border Theme="{StaticResource CardBorder}"> <Border Theme="{StaticResource CardBorder}">
<TabControl TabStripPlacement="Top"> <TabControl
Classes.ReverseSeparator="{Binding #reverse.IsChecked}"
TabStripPlacement="{Binding #place.SelectedValue}">
<TabItem Content="Hello 1" Header="Tab 1" /> <TabItem Content="Hello 1" Header="Tab 1" />
<TabItem Content="Hello 2" Header="Tab 2" /> <TabItem Content="Hello 2" Header="Tab 2" />
<TabItem Content="Hello 3" Header="Tab 3" /> <TabItem Content="Hello 3" Header="Tab 3" />
@@ -24,8 +53,22 @@
IsEnabled="False" /> IsEnabled="False" />
</TabControl> </TabControl>
</Border> </Border>
<Border Theme="{StaticResource CardBorder}"
Height="300">
<TabControl
Theme="{StaticResource ScrollTabControl}"
Classes.ReverseSeparator="{Binding #reverse.IsChecked}"
ItemsSource="{Binding Items}"
TabStripPlacement="{Binding #place.SelectedValue}" />
</Border>
</StackPanel>
</TabItem>
<TabItem Header="Line">
<StackPanel>
<Border Theme="{StaticResource CardBorder}"> <Border Theme="{StaticResource CardBorder}">
<TabControl TabStripPlacement="Left"> <TabControl
Theme="{StaticResource LineTabControl}"
TabStripPlacement="{Binding #place.SelectedValue}">
<TabItem Content="Hello 1" Header="Tab 1" /> <TabItem Content="Hello 1" Header="Tab 1" />
<TabItem Content="Hello 2" Header="Tab 2" /> <TabItem Content="Hello 2" Header="Tab 2" />
<TabItem Content="Hello 3" Header="Tab 3" /> <TabItem Content="Hello 3" Header="Tab 3" />
@@ -36,8 +79,21 @@
IsEnabled="False" /> IsEnabled="False" />
</TabControl> </TabControl>
</Border> </Border>
<Border Theme="{StaticResource CardBorder}"
Height="300">
<TabControl
Theme="{StaticResource ScrollLineTabControl}"
ItemsSource="{Binding Items}"
TabStripPlacement="{Binding #place.SelectedValue}" />
</Border>
</StackPanel>
</TabItem>
<TabItem Header="Card">
<StackPanel>
<Border Theme="{StaticResource CardBorder}"> <Border Theme="{StaticResource CardBorder}">
<TabControl TabStripPlacement="Right"> <TabControl
Theme="{StaticResource CardTabControl}"
TabStripPlacement="{Binding #place.SelectedValue}">
<TabItem Content="Hello 1" Header="Tab 1" /> <TabItem Content="Hello 1" Header="Tab 1" />
<TabItem Content="Hello 2" Header="Tab 2" /> <TabItem Content="Hello 2" Header="Tab 2" />
<TabItem Content="Hello 3" Header="Tab 3" /> <TabItem Content="Hello 3" Header="Tab 3" />
@@ -48,8 +104,21 @@
IsEnabled="False" /> IsEnabled="False" />
</TabControl> </TabControl>
</Border> </Border>
<Border Theme="{StaticResource CardBorder}"
Height="300">
<TabControl
Theme="{StaticResource ScrollCardTabControl}"
ItemsSource="{Binding Items}"
TabStripPlacement="{Binding #place.SelectedValue}" />
</Border>
</StackPanel>
</TabItem>
<TabItem Header="Button">
<StackPanel>
<Border Theme="{StaticResource CardBorder}"> <Border Theme="{StaticResource CardBorder}">
<TabControl TabStripPlacement="Bottom"> <TabControl
Theme="{StaticResource ButtonTabControl}"
TabStripPlacement="{Binding #place.SelectedValue}">
<TabItem Content="Hello 1" Header="Tab 1" /> <TabItem Content="Hello 1" Header="Tab 1" />
<TabItem Content="Hello 2" Header="Tab 2" /> <TabItem Content="Hello 2" Header="Tab 2" />
<TabItem Content="Hello 3" Header="Tab 3" /> <TabItem Content="Hello 3" Header="Tab 3" />
@@ -60,36 +129,16 @@
IsEnabled="False" /> IsEnabled="False" />
</TabControl> </TabControl>
</Border> </Border>
<Border Theme="{StaticResource CardBorder}"> <Border Theme="{StaticResource CardBorder}"
<TabStrip> Height="300">
<TabStripItem>Tab 1</TabStripItem>
<TabStripItem>Tab 2</TabStripItem>
</TabStrip>
</Border>
<Border Height="300" Theme="{DynamicResource CardBorder}">
<TabControl <TabControl
Theme="{StaticResource ScrollButtonTabControl}"
ItemsSource="{Binding Items}" ItemsSource="{Binding Items}"
TabStripPlacement="Top" TabStripPlacement="{Binding #place.SelectedValue}" />
Theme="{DynamicResource ScrollTabControl}" />
</Border>
<Border Height="300" Theme="{DynamicResource CardBorder}">
<TabControl
ItemsSource="{Binding Items}"
TabStripPlacement="Left"
Theme="{DynamicResource ScrollTabControl}" />
</Border>
<Border Height="300" Theme="{DynamicResource CardBorder}">
<TabControl
ItemsSource="{Binding Items}"
TabStripPlacement="Bottom"
Theme="{DynamicResource ScrollTabControl}" />
</Border>
<Border Height="300" Theme="{DynamicResource CardBorder}">
<TabControl
ItemsSource="{Binding Items}"
TabStripPlacement="Right"
Theme="{DynamicResource ScrollTabControl}" />
</Border> </Border>
</StackPanel> </StackPanel>
</TabItem>
</TabControl>
</StackPanel>
</ScrollViewer> </ScrollViewer>
</UserControl> </UserControl>

9
demo/Semi.Avalonia.Demo/ViewModels/TabControlDemoViewModel.cs
View File

@@ -4,12 +4,7 @@ using CommunityToolkit.Mvvm.ComponentModel;
namespace Semi.Avalonia.Demo.ViewModels; namespace Semi.Avalonia.Demo.ViewModels;
public class TabControlDemoViewModel: ObservableObject public class TabControlDemoViewModel : ObservableObject
{ {
public ObservableCollection<string> Items { get; set; } public ObservableCollection<string> Items => new(Enumerable.Range(1, 200).Select(a => "Tab " + a));
public TabControlDemoViewModel()
{
Items = new ObservableCollection<string>(Enumerable.Range(1, 200).Select(a => "Tab " + a));
}
} }