更新
This commit is contained in:
ShrlAlgo
197
AntdWpfDemo/Views/InputView.xaml
Normal file
197
AntdWpfDemo/Views/InputView.xaml
Normal file
@@ -0,0 +1,197 @@
|
||||
<UserControl x:Class="AntdWpfDemo.Views.InputView"
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
||||
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
||||
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
||||
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"
|
||||
mc:Ignorable="d"
|
||||
d:DesignHeight="600"
|
||||
d:DesignWidth="930">
|
||||
|
||||
<ScrollViewer>
|
||||
<Grid Margin="16 0">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="Auto" />
|
||||
<RowDefinition Height="*" />
|
||||
<RowDefinition Height="*" />
|
||||
</Grid.RowDefinitions>
|
||||
<StackPanel>
|
||||
<Label Style="{StaticResource Ant.H1}" Content="Input" />
|
||||
<TextBlock Style="{StaticResource Ant.P}" Text="A basic widget for getting the user input is a text field. Keyboard and mouse can be used for providing or changing data." />
|
||||
|
||||
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
|
||||
<TextBlock Style="{StaticResource Ant.P}" Text="A user input in a form field is needed.
A search input is required." />
|
||||
|
||||
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
|
||||
</StackPanel>
|
||||
<Grid Grid.Row="1">
|
||||
<Grid.Resources>
|
||||
<Style BasedOn="{StaticResource Ant.TextBox}" TargetType="TextBox">
|
||||
<Setter Property="Margin" Value="0 16 16 0" />
|
||||
</Style>
|
||||
<Style BasedOn="{StaticResource Ant.PasswordBox}" TargetType="PasswordBox">
|
||||
<Setter Property="Margin" Value="0 16 16 0" />
|
||||
</Style>
|
||||
</Grid.Resources>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition />
|
||||
<ColumnDefinition />
|
||||
</Grid.ColumnDefinitions>
|
||||
<StackPanel Margin="8 0">
|
||||
<antd:CodeBox Title="Basic usage">
|
||||
<antd:CodeBox.Description>
|
||||
Basic usage example.
|
||||
</antd:CodeBox.Description>
|
||||
<antd:CodeBox.Content>
|
||||
<StackPanel>
|
||||
<TextBox antd:Input.Placeholder="Basic usage" />
|
||||
<PasswordBox antd:Input.Placeholder="Basic usage" antd:Input.Eyeable="True" Password="666" />
|
||||
</StackPanel>
|
||||
</antd:CodeBox.Content>
|
||||
<antd:CodeBox.Code>
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" />\n
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" />\n\n
|
||||
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
|
||||
<WrapPanel>\n
|
||||
\t<antd:Tag>Tag 1</antd:Tag>\n
|
||||
\t<antd:Tag>Link</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True">Tag 2</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]">Prevent Default</antd:Tag>\n
|
||||
</WrapPanel>
|
||||
</antd:CodeBox.Code>
|
||||
</antd:CodeBox>
|
||||
<antd:CodeBox Title="Pre / Post tab">
|
||||
<antd:CodeBox.Description>
|
||||
Using pre & post tabs example.
|
||||
</antd:CodeBox.Description>
|
||||
<antd:CodeBox.Content>
|
||||
<StackPanel>
|
||||
<Grid>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="Auto" />
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition Width="Auto" />
|
||||
</Grid.ColumnDefinitions>
|
||||
<antd:Border Grid.Column="0"
|
||||
UseLayoutRounding="True"
|
||||
CornerRadius="4 0 0 4"
|
||||
BorderThickness="1 1 0 1"
|
||||
BorderBrush="{DynamicResource InputBorderBrush}" Padding="11 0">
|
||||
<TextBlock Text="http://" VerticalAlignment="Center" />
|
||||
</antd:Border>
|
||||
<TextBox Grid.Column="1" Text="mysite" Margin="0" antd:Control.CornerRadius="0" />
|
||||
<antd:Border Grid.Column="2"
|
||||
UseLayoutRounding="True"
|
||||
CornerRadius="0 4 4 0"
|
||||
BorderThickness="0 1 1 1"
|
||||
BorderBrush="{DynamicResource InputBorderBrush}" Padding="11 0">
|
||||
<TextBlock Text=".com" VerticalAlignment="Center" />
|
||||
</antd:Border>
|
||||
</Grid>
|
||||
</StackPanel>
|
||||
</antd:CodeBox.Content>
|
||||
<antd:CodeBox.Code>
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" />\n
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" />\n\n
|
||||
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
|
||||
<WrapPanel>\n
|
||||
\t<antd:Tag>Tag 1</antd:Tag>\n
|
||||
\t<antd:Tag>Link</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True">Tag 2</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]">Prevent Default</antd:Tag>\n
|
||||
</WrapPanel>
|
||||
</antd:CodeBox.Code>
|
||||
</antd:CodeBox>
|
||||
<antd:CodeBox Title="Search box">
|
||||
<antd:CodeBox.Description>
|
||||
Example of creating a search box by grouping a standard input with a search button.
|
||||
</antd:CodeBox.Description>
|
||||
<antd:CodeBox.Content>
|
||||
<StackPanel>
|
||||
<TextBox antd:Input.Placeholder="input search text" antd:Input.Clearable="True">
|
||||
<antd:Input.Suffix>
|
||||
<antd:Icon Type="search" />
|
||||
</antd:Input.Suffix>
|
||||
</TextBox>
|
||||
<TextBox antd:Input.Placeholder="input search text" Padding="12 0 0 0">
|
||||
<antd:Input.Suffix>
|
||||
<antd:Button Margin="8 -1 -2 -1" Type="Primary" Content="Search" antd:Control.CornerRadius="0 4 4 0" />
|
||||
</antd:Input.Suffix>
|
||||
</TextBox>
|
||||
<TextBox antd:Input.Placeholder="input search text" antd:Control.Size="Large" Padding="12 0 0 0">
|
||||
<antd:Input.Suffix>
|
||||
<antd:Button Type="Primary" Size="Large" Margin="8 -1 -2 -1" Content="Search" antd:Control.CornerRadius="0 4 4 0" />
|
||||
</antd:Input.Suffix>
|
||||
</TextBox>
|
||||
</StackPanel>
|
||||
</antd:CodeBox.Content>
|
||||
<antd:CodeBox.Code>
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" />\n
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" />\n\n
|
||||
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
|
||||
<WrapPanel>\n
|
||||
\t<antd:Tag>Tag 1</antd:Tag>\n
|
||||
\t<antd:Tag>Link</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True">Tag 2</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]">Prevent Default</antd:Tag>\n
|
||||
</WrapPanel>
|
||||
</antd:CodeBox.Code>
|
||||
</antd:CodeBox>
|
||||
<antd:CodeBox Title="Prefix and Suffix">
|
||||
<antd:CodeBox.Description>
|
||||
Add prefix or suffix icons inside input.
|
||||
</antd:CodeBox.Description>
|
||||
<antd:CodeBox.Content>
|
||||
<TextBox antd:Input.Placeholder="Enter your username">
|
||||
<antd:Input.Prefix>
|
||||
<antd:Icon Type="user" Foreground="#3F000000" />
|
||||
</antd:Input.Prefix>
|
||||
<antd:Input.Suffix>
|
||||
<antd:Icon Type="close" Foreground="#3F000000" />
|
||||
</antd:Input.Suffix>
|
||||
</TextBox>
|
||||
</antd:CodeBox.Content>
|
||||
<antd:CodeBox.Code>
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" />\n
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" />\n\n
|
||||
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
|
||||
<TextBox antd:Input.Placeholder="Enter your username">\n
|
||||
\t<antd:Input.Prefix>\n
|
||||
\t\t<antd:Icon Type="user" Foreground="#3F000000" />\n
|
||||
\t</antd:Input.Prefix>\n
|
||||
\t<antd:Input.Suffix>\n
|
||||
\t\t<antd:Icon Type="close" Foreground="#3F000000" />\n
|
||||
\t</antd:Input.Suffix>\n
|
||||
</TextBox>
|
||||
</antd:CodeBox.Code>
|
||||
</antd:CodeBox>
|
||||
</StackPanel>
|
||||
<StackPanel Grid.Column="1" Margin="8 0">
|
||||
<antd:CodeBox Title="Three sizes of Input">
|
||||
<antd:CodeBox.Description>
|
||||
There are three sizes of an Input box: `Large` (40px)、`Default` (32px) and `Small` (24px).
|
||||
</antd:CodeBox.Description>
|
||||
<antd:CodeBox.Content>
|
||||
<StackPanel>
|
||||
<TextBox antd:Input.Placeholder="large size" antd:Control.Size="Large" />
|
||||
<TextBox antd:Input.Placeholder="default size" />
|
||||
<TextBox antd:Input.Placeholder="small size" antd:Control.Size="Small" />
|
||||
</StackPanel>
|
||||
</antd:CodeBox.Content>
|
||||
<antd:CodeBox.Code>
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" />\n
|
||||
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" />\n\n
|
||||
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
|
||||
<WrapPanel>\n
|
||||
\t<antd:Tag>Tag 1</antd:Tag>\n
|
||||
\t<antd:Tag>Link</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True">Tag 2</antd:Tag>\n
|
||||
\t<antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]">Prevent Default</antd:Tag>\n
|
||||
</WrapPanel>
|
||||
</antd:CodeBox.Code>
|
||||
</antd:CodeBox>
|
||||
</StackPanel>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</ScrollViewer>
|
||||
</UserControl>
|
||||
Reference in New Issue
Block a user