2025-07-11 09:20:23 +08:00
<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>
2025-07-12 23:31:32 +08:00
<antd:AntdBorder Grid.Column="0"
2025-07-11 09:20:23 +08:00
UseLayoutRounding="True"
CornerRadius="4 0 0 4"
BorderThickness="1 1 0 1"
BorderBrush="{DynamicResource InputBorderBrush}" Padding="11 0">
<TextBlock Text="http://" VerticalAlignment="Center" />
2025-07-12 23:31:32 +08:00
</antd:AntdBorder>
<TextBox Grid.Column="1" Text="mysite" Margin="0" antd:AntdControl.CornerRadius="0" />
<antd:AntdBorder Grid.Column="2"
2025-07-11 09:20:23 +08:00
UseLayoutRounding="True"
CornerRadius="0 4 4 0"
BorderThickness="0 1 1 1"
BorderBrush="{DynamicResource InputBorderBrush}" Padding="11 0">
<TextBlock Text=".com" VerticalAlignment="Center" />
2025-07-12 23:31:32 +08:00
</antd:AntdBorder>
2025-07-11 09:20:23 +08:00
</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>
2025-07-12 23:31:32 +08:00
<antd:AntButton Margin="8 -1 -2 -1" Type="Primary" Content="Search" antd:AntdControl.CornerRadius="0 4 4 0" />
2025-07-11 09:20:23 +08:00
</antd:Input.Suffix>
</TextBox>
2025-07-12 23:31:32 +08:00
<TextBox antd:Input.Placeholder="input search text" antd:AntdControl.Size="Large" Padding="12 0 0 0">
2025-07-11 09:20:23 +08:00
<antd:Input.Suffix>
2025-07-12 23:31:32 +08:00
<antd:AntButton Type="Primary" Size="Large" Margin="8 -1 -2 -1" Content="Search" antd:AntdControl.CornerRadius="0 4 4 0" />
2025-07-11 09:20:23 +08:00
</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>
2025-07-12 23:31:32 +08:00
<TextBox antd:Input.Placeholder="large size" antd:AntdControl.Size="Large" />
2025-07-11 09:20:23 +08:00
<TextBox antd:Input.Placeholder="default size" />
2025-07-12 23:31:32 +08:00
<TextBox antd:Input.Placeholder="small size" antd:AntdControl.Size="Small" />
2025-07-11 09:20:23 +08:00
</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>
