1

Blendを使用してスタイルをコピーし、必要なほとんどの変更を加えましたが、丸めを完全に削除して周囲の空白を削除する方法に固執しました。矢印付きのボタンは18で、ドロップダウン全体の高さは18である必要があります。これで、ボタンが中央に配置されていないときに、周りにパディングと白が表示されます。さらに、この丸めは右ですか?

ここに画像の説明を入力してください

これが私のスタイルです:

<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>    
4

1 に答える 1

2

さて、今回ようやく正解しました。

これらはすべて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)

結果:

そして、それが実際に機能したことを証明するためだけに...

ここに画像の説明を入力してください

于 2012-06-29T20:56:24.787 に答える