gpt4 book ai didi

c# - 制作带圆角的 WPF 组合框

转载 作者:太空宇宙 更新时间:2023-11-03 12:42:21 25 4
gpt4 key购买 nike

在我的应用程序中,我需要使我使用的组合框具有圆角。我从 this question 的答案中发布的 XAML 开始。并做了一些修改。我决定我不太喜欢它的样子,所以我试着设计它的样式并让它看起来更像默认的组合框。现在我的组合框看起来像这样:enter image description here ,

当下拉时:

enter image description here

问题是当用户将鼠标放在组合框上时,它看起来像这样:enter image description here .如果我使用 Snoop ,我可以看到这个信息:

enter image description here

它说该边框背景的值被设置为“#FFBEE6FD”,这是当鼠标悬停在组合框上时显示的颜色。值源是“ParentTemplateTrigger”。我的问题是我不知道这个边界是从哪里来的,也不知道它为什么会得到那个值。我试图添加带有 setter 的模板触发器以将背景设置为白色,但我不知道在哪里设置这个神秘边框的值。

这是我的 ComboBox 的 XAML:

<ComboBox x:Name="ScanSizesComboBox"
Style="{StaticResource roundedCornersComboBox}"
Grid.ZIndex="4"
ItemsSource="{Binding ScanSizes}"
SelectedItem="{Binding SelectedScanSize, Mode=TwoWay}"
ToolTip="{Binding (Validation.Errors)[0].ErrorContent}"
Margin="0,10,89,0"
HorizontalAlignment="Right"
Width="61"
Height="26"
VerticalAlignment="Top"
Grid.Row="4">

</ComboBox>

这是样式:

<Style x:Key="ComboBoxTextBoxStyle" TargetType="{x:Type TextBox}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<Border Name="ComboBoxTextBoxStyleBorder" CornerRadius="2"
BorderThickness="0,1,0,1"
Margin="0,0,1,1"
Background="{TemplateBinding Background}">
<Border.Style>
<Style TargetType="Border">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="White"/>
</Trigger>

</Style.Triggers>
</Style>
</Border.Style>
<ScrollViewer x:Name="PART_ContentHost"/>
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="IsReadOnly" Value="True"/>
</Style>

<!--Rounded corners combo box-->
<Style TargetType="{x:Type ComboBox}" x:Key="roundedCornersComboBox">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBox}">
<Border Name="roundedCornerComboBoxBorder" BorderBrush="#CCCCCC" BorderThickness="1" CornerRadius="3" ClipToBounds="True" Background="White">
<Border.Style>
<Style TargetType="Border">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" Value="White"/>
</Trigger>

</Style.Triggers>
</Style>
</Border.Style>
<Canvas>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBox Name="PART_EditableTextBox"
Panel.ZIndex="0"
Style="{StaticResource ComboBoxTextBoxStyle}"
Padding="0,0,0,0"
IsHitTestVisible="False"
Height="{TemplateBinding Height}">
</TextBox>
<ToggleButton Grid.Column="1" Margin="0, 0, 0, 0"
Panel.ZIndex="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
BorderBrush="Transparent"
Background="Transparent"
Height="{TemplateBinding Height}"
Width="60"
IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
HorizontalContentAlignment="Right"
ClickMode="Press">

<ToggleButton.Style>
<Style TargetType="ToggleButton">
<Style.Triggers>
<Trigger Property="IsMouseOver"
Value="true">
<Setter Property="Background"
Value="White" />
</Trigger>
</Style.Triggers>
</Style>
</ToggleButton.Style>

<Path Grid.Column="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M 0 0 L 4 4 L 8 0 Z"
Fill="DodgerBlue" />
</ToggleButton>
<ContentPresenter Name="ContentSite"
Cursor="Arrow"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
VerticalAlignment="Center"
HorizontalAlignment="Left"
Margin="3,0,0,0">
</ContentPresenter>
<Popup Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
AllowsTransparency="True"
Focusable="False"
PopupAnimation="Slide">
<Grid Name="DropDown"
SnapsToDevicePixels="True"
MinWidth="{TemplateBinding ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}">
<Border
x:Name="DropDownBorder"
BorderThickness="1"
CornerRadius="5"
Background="White"
BorderBrush="Black"/>
<ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
</Canvas>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

最终,我希望用户能够将他/她的鼠标放在组合框上,并让它看起来与未突出显示时一样。任何帮助表示赞赏。谢谢。

最佳答案

继续我们的评论对话(通常 SO 会尽量避免过多的噪音),这可能会引起您的注意。

因此,如果我从新的 WPF 应用程序中获取所有模板内容到基本默认 ComboBoxComboBoxItem,这就是输出。当然,您不需要所有这些,但它应该在一定程度上确保所有预期的功能和 DOM 部分都在这里以供引用,因此您拥有所有可用的东西,例如触发器、模板绑定(bind)部分等。

请注意各个部分中的各种 BorderRectangle 元素,它们需要更改才能实现所有内容的圆角。但是,我无法提供任何关于它如何影响 MahApps 的见解,因为我在这方面的经验非常有限,因为我一直只是制作自己的东西来完成它本质上做的事情。

希望对您有所帮助。这对于 SO 的提交要求来说太长了,所以这里是 PasteBin link .

关于c# - 制作带圆角的 WPF 组合框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38468465/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com