Question

我使用Blend复制了样式，进行了我需要的大部分更改，但实际上仍然坚持如何完全去除圆角并删除周围的这个空白区域。带有arrouw的按钮应该是18，整个下拉应该是18高。现在，按钮不居中，有填充和白色。另外，这个四舍五入吧？

enter image description here

这是我的风格：

<Style x:Key="ComboBoxReadonlyToggleButton" TargetType="{x:Type ToggleButton}">
            <Setter Property="OverridesDefaultStyle" Value="true"/>
            <Setter Property="IsTabStop" Value="false"/>
            <Setter Property="Focusable" Value="false"/>
            <Setter Property="ClickMode" Value="Press"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                        <Microsoft_Windows_Themes:ButtonChrome Height="18"
                            x:Name="Chrome" RoundCorners="False" 
                            BorderBrush="{TemplateBinding BorderBrush}" 
                            Background="{TemplateBinding Background}" 
                            RenderMouseOver="{TemplateBinding IsMouseOver}" 
                            RenderPressed="{TemplateBinding IsPressed}" SnapsToDevicePixels="true">
                            <Border
                                BorderBrush="#a6a6a6" BorderThickness="1"
                                HorizontalAlignment="Right" Width="18" Height="18">
                                <Border.Background>                                    
                                    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
                                        <GradientStop Color="#899ba5" />
                                        <GradientStop Color="#4f6473" Offset="1" />
                                    </LinearGradientBrush>                                    
                                </Border.Background>
                                <Grid>
                                    <Path x:Name="Arrow" Fill="#dcdcdc" HorizontalAlignment="Center" VerticalAlignment="Center">
                                        <Path.Data>
                                            <Geometry>M 0 0 L 3.5 4 L 7 0 Z</Geometry>
                                        </Path.Data>
                                    </Path>
                                </Grid>
                            </Border>                            
                        </Microsoft_Windows_Themes:ButtonChrome>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>        
        <Style x:Key="ComboBoxStyle" TargetType="{x:Type ComboBox}">
            <Setter Property="Height" Value="18" />
            <Setter Property="Foreground" Value="#1a3e55"/>
            <Setter Property="Background" Value="#f7f7f7"/>
            <Setter Property="BorderBrush" Value="#a6a6a6"/>
            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>

            <Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
            <Setter Property="ScrollViewer.PanningMode" Value="Both"/>
            <Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ComboBox}">
                        <Grid x:Name="MainGrid" 
                            SnapsToDevicePixels="true">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition MinWidth="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" Width="0"/>
                            </Grid.ColumnDefinitions>
                            <Popup x:Name="PART_Popup" AllowsTransparency="true" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}" Margin="1" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom">
                                <Microsoft_Windows_Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{Binding ActualWidth, ElementName=MainGrid}">
                                    <Border x:Name="DropDownBorder" BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" BorderThickness="1" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}">
                                        <ScrollViewer x:Name="DropDownScrollViewer">
                                            <Grid RenderOptions.ClearTypeHint="Enabled">
                                                <Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
                                                    <Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=DropDownBorder}" Height="{Binding ActualHeight, ElementName=DropDownBorder}" Width="{Binding ActualWidth, ElementName=DropDownBorder}"/>
                                                </Canvas>
                                                <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                            </Grid>
                                        </ScrollViewer>
                                    </Border>
                                </Microsoft_Windows_Themes:SystemDropShadowChrome>
                            </Popup>
                            <ToggleButton 
                                BorderBrush="{TemplateBinding BorderBrush}" 
                                Background="{TemplateBinding Background}" 
                                Grid.ColumnSpan="2" 
                                IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" 
                                Style="{StaticResource ComboBoxReadonlyToggleButton}"/>
                            <ContentPresenter 
                                ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
                                ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" 
                                Content="{TemplateBinding SelectionBoxItem}" 
                                ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}" 
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                IsHitTestVisible="false" 
                                Margin="{TemplateBinding Padding}" 
                                SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>           
        </Style>

Answer 1

好的，我终于这次做对了。

所有这些都在您的ButtonChrome样式模板中。我使用这个答案https://stackoverflow.com/a/4554309/1449777来改变这种风格。从此处提供的链接下载类文件：http://www.mediafire.com/?wnra4qj4qt07wn6

首先，让我们摆脱圆角。

将切换按钮的样式更新为按钮chrome类的本地副本，并将RoundedCorners设置为“false”。

<local:MyButtonChrome RoundCorners="False" ... >

要修复圆角，我修改了buttonchrome类以正确实现RoundedCorners =“false”。在DrawBorder函数中，我更改了逻辑以将边框（行号128）绘制为：

if (this.RoundCorners)
{
    Rect rectangle = new Rect(bounds.Left + 0.5, bounds.Top + 0.5, bounds.Width - 1.0, bounds.Height - 1.0);
    if (base.IsEnabled && (pen != null))
    {
        dc.DrawRoundedRectangle(null, pen, rectangle, 2.75, 2.75);
    }
    if (borderOverlayPen != null)
    {
        dc.DrawRoundedRectangle(null, borderOverlayPen, rectangle, 2.75, 2.75);
    }
}
else
{
    Rect rectangle = new Rect(bounds.Left + 0.5, bounds.Top + 0.5, bounds.Width - 1.0, bounds.Height - 1.0);
    if (base.IsEnabled && (pen != null))
    {
        dc.DrawRectangle(null, pen, rectangle);
    }
    if (borderOverlayPen != null)
    {
        dc.DrawRectangle(null, borderOverlayPen, rectangle);
    }
}

我将InnerBorder功能（第180行）更改为：

private void DrawInnerBorder(DrawingContext dc, ref Rect bounds)
{
    if (DisableInnerBorder == false && ((base.IsEnabled || this.RoundCorners) && ((bounds.Width >= 4.0) && (bounds.Height >= 4.0))))
    {
        Pen innerBorderPen = this.InnerBorderPen;
        if (innerBorderPen != null)
        {
            if (this.RoundCorners)
            {
                dc.DrawRoundedRectangle(null, innerBorderPen, new Rect(bounds.Left + 1.5, bounds.Top + 1.5, bounds.Width - 3.0, bounds.Height - 3.0), 1.75, 1.75);
            }
            else
            {
                dc.DrawRoundedRectangle(null, innerBorderPen, new Rect(bounds.Left + 1.5, bounds.Top + 1.5, bounds.Width - 3.0, bounds.Height - 3.0), 0, 0);
            }
        }
    }
}

现在让我们处理填充。

这个需要一段时间才能发现，但我在功能ArrangeOverride（第40行）中找到了它。只需删除以下功能，它就不会再覆盖该位置。

protected override Size ArrangeOverride(Size finalSize)

<强>结果：

只是为了证明它确实有效......

enter image description here

样式组合框去除内部填充并摆脱圆角。怎么样？

1 个答案: