fix: Update TextBox theme.

This commit is contained in:
rabbitism 2023-02-15 15:48:14 +08:00
parent 3fe0effc9b
commit 3ecebc0387
5 changed files with 89 additions and 58 deletions

View File

@ -1,26 +1,46 @@
<UserControl
x:Class="Semi.Avalonia.Demo.Pages.TextBoxDemo" xmlns="https://github.com/avaloniaui"
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" d:DesignHeight="450"
d:DesignWidth="800" mc:Ignorable="d">
x:Class="Semi.Avalonia.Demo.Pages.TextBoxDemo"
xmlns="https://github.com/avaloniaui"
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"
d:DesignHeight="450"
d:DesignWidth="800"
mc:Ignorable="d">
<ScrollViewer>
<StackPanel HorizontalAlignment="Left" Spacing="20">
<TextBox Width="300" />
<TextBox Width="300" Classes="Large" />
<TextBox Width="300" Classes="Small" />
<TextBox Width="300" Watermark="Please use this" />
<TextBox Width="300" InnerLeftContent="http://" />
<TextBox Width="300" InnerRightContent=".com" />
<TextBox
Width="500" InnerLeftContent="http://"
Width="500"
InnerLeftContent="http://"
InnerRightContent=".com" />
<TextBox Width="300" Classes="clearButton" />
<TextBox Width="300" PasswordChar="*" />
<TextBox
Width="300" Classes="revealPasswordButton"
Width="300"
Classes="revealPasswordButton"
PasswordChar="*" />
<TextBox
Width="500" InnerLeftContent="http://"
Width="500"
InnerLeftContent="http://"
InnerRightContent=".com"
Theme="{StaticResource BorderlessTextBox}" />
IsEnabled="False" />
<TextBox
Width="500"
Classes="Bordered"
InnerLeftContent="http://"
InnerRightContent=".com" />
<TextBox
Width="500"
Classes="Bordered"
InnerLeftContent="http://"
InnerRightContent=".com"
IsEnabled="False" />
</StackPanel>
</ScrollViewer>
</UserControl>

View File

@ -56,7 +56,7 @@
TargetType="AutoCompleteBox">
<ControlTheme.Children>
<Style Selector="^ /template/ TextBox#PART_TextBox">
<Setter Property="Theme" Value="{StaticResource BorderlessTextBox}" />
<Setter Property="Theme" Value="{DynamicResource BorderlessTextBox}" />
</Style>
</ControlTheme.Children>
<Setter Property="Background" Value="{DynamicResource AutoCompleteBoxBorderlessBackground}" />

View File

@ -176,18 +176,24 @@
</Border>
</ControlTemplate>
</Setter>
<Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
<Setter Property="Border.Background" Value="{DynamicResource TextBoxPointeroverBackground}" />
</Style>
<Style Selector="^:pressed /template/ Border#PART_ContentPresenterBorder">
<Setter Property="Border.Background" Value="{DynamicResource TextBoxPressedBackground}" />
</Style>
<Style Selector="^:focus /template/ Border#PART_ContentPresenterBorder">
<Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
</Style>
<Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
<Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
<Setter Property="Border.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
</Style>
<Style Selector="^:disabled">
<Setter Property="TextBox.Foreground" Value="{DynamicResource TextBoxDisabledForeground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
</Style>
<Style Selector="^:pointerover">
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxPointerOverBorderBrush}" />
</Style>
<Style Selector="^:focus">
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
</Style>
<Style Selector="^.clearButton">
<Style Selector="^.clearButton, ^.ClearButton">
<Style Selector="^[AcceptsReturn=False][IsReadOnly=False]:focus:not(:empty) /template/ Button#PART_ClearButton">
<Setter Property="Button.IsVisible" Value="True" />
</Style>
@ -195,7 +201,7 @@
<Setter Property="Button.IsVisible" Value="True" />
</Style>
</Style>
<Style Selector="^.revealPasswordButton">
<Style Selector="^.revealPasswordButton, ^.RevealPasswordButton">
<Style Selector="^ /template/ ToggleButton#PART_RevealButton">
<Setter Property="ToggleButton.IsVisible" Value="True" />
</Style>
@ -206,21 +212,22 @@
<Style Selector="^.Small">
<Setter Property="TextBox.MinHeight" Value="{DynamicResource TextBoxSmallHeight}" />
</Style>
</ControlTheme>
<ControlTheme
x:Key="BorderlessTextBox"
BasedOn="{StaticResource {x:Type TextBox}}"
TargetType="TextBox">
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessDefaultBackground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderlessDefaultBorderBrush}" />
<Style Selector="^:pointerover">
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessPointeroverBackground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderlessPointeroverBorderBrush}" />
<Style Selector="^.Bordered">
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderedDefaultBackground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderedDefaultBorderBrush}" />
<Style Selector="^:pointerover /template/ Border#PART_ContentPresenterBorder">
<Setter Property="Border.Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
<Setter Property="Border.BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
</Style>
<Style Selector="^:focus">
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderlessPointeroverBackground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxFocusBorderBrush}" />
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxBorderedPointeroverBackground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxBorderedPointeroverBorderBrush}" />
</Style>
<Style Selector="^:disabled /template/ Border#PART_ContentPresenterBorder">
<Setter Property="TextBox.Background" Value="{DynamicResource TextBoxDisabledBackground}" />
<Setter Property="TextBox.BorderBrush" Value="{DynamicResource TextBoxDisabledBorderBrush}" />
</Style>
</Style>
</ControlTheme>
</ResourceDictionary>

View File

@ -4,26 +4,28 @@
xmlns:sys="clr-namespace:System;assembly=System.Runtime">
<SolidColorBrush x:Key="TextBoxTextCaretBrush" Color="White" />
<SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="#41464C" />
<SolidColorBrush x:Key="TextBoxDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="#7FC1FF" />
<SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#A9D7FF" />
<SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxDefaultBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="TextBoxPointeroverBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="TextBoxPressedBackground" Opacity="0.2" Color="White" />
<SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#54A9FF" />
<SolidColorBrush x:Key="TextBoxForeground" Color="#F9F9F9" />
<SolidColorBrush x:Key="TextBoxWatermarkForeground" Color="#F9F9F9" />
<SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.62" Color="#F9F9F9" />
<SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.6" Color="#F9F9F9" />
<SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.2" Color="#E6E8EA" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Opacity="0.4" Color="#E6E8EA" />
<SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#403238" />
<SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#E6E8EA" />
<SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#F9F9F9" />
<SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderlessDefaultBackground" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="TextBoxBorderlessDefaultBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderlessPointeroverBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="TextBoxBorderlessPointeroverBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.12" Color="White" />
<SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
<sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
<sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>

View File

@ -4,26 +4,28 @@
xmlns:sys="clr-namespace:System;assembly=System.Runtime">
<SolidColorBrush x:Key="TextBoxTextCaretBrush" Color="Black" />
<SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="#C6CACD" />
<SolidColorBrush x:Key="TextBoxDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxDefaultBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxDefaultBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxPointeroverBackground" Opacity="0.09" Color="#FF2E3238" />
<SolidColorBrush x:Key="TextBoxPressedBackground" Opacity="0.13" Color="#FF2E3238" />
<SolidColorBrush x:Key="TextBoxFocusBackground" Opacity="0.05" Color="#E6E8EA" />
<SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="#0062D6" />
<SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#004FB3" />
<SolidColorBrush x:Key="TextBoxPointerOverBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxFocusBorderBrush" Color="#0077FA" />
<SolidColorBrush x:Key="TextBoxForeground" Color="#1C1F23" />
<SolidColorBrush x:Key="TextBoxWatermarkForeground" Color="#1C1F23" />
<SolidColorBrush x:Key="TextBoxInnerForeground" Opacity="0.62" Color="#1C1F23" />
<SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.2" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Opacity="0.4" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxButtonDefaultForeground" Opacity="0.08" Color="#FF1C1F23" />
<SolidColorBrush x:Key="TextBoxButtonPointerOverForeground" Color="#0077FA" />
<SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#403238" />
<SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#1C1F23" />
<SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="#E6E8EA" />
<SolidColorBrush x:Key="TextBoxDisabledBackground" Opacity="0.04" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxDisabledForeground" Opacity="0.35" Color="#FF1C1F23" />
<SolidColorBrush x:Key="TextBoxDisabledBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderlessDefaultBackground" Opacity="0.05" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxBorderlessDefaultBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderlessPointeroverBackground" Opacity="0.09" Color="#2E3238" />
<SolidColorBrush x:Key="TextBoxBorderlessPointeroverBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderedDefaultBackground" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderedDefaultBorderBrush" Opacity="0.08" Color="#FF1C1F23" />
<SolidColorBrush x:Key="TextBoxBorderedPointeroverBackground" Color="Transparent" />
<SolidColorBrush x:Key="TextBoxBorderedPointeroverBorderBrush" Color="#0062D6" />
<sys:Double x:Key="TextBoxDefaultHeight">30</sys:Double>
<sys:Double x:Key="TextBoxSmallHeight">22</sys:Double>