将CheckBox大小设置为Box Size

时间:2016-03-22 17:50:30

标签: checkbox win-universal-app

如何将CheckBox尺寸设置为其尺寸?

我有CheckBox。我需要将复选框的大小设置为其框大小。现在我的复选框如下所示。

enter image description here

我将复选框背景设置为透明。当父母的背景为白色时,可以。但是当父控件的背景为黑色时,该复选框是不可见的。所以我需要设置背景颜色。

1 个答案:

答案 0 :(得分:1)

我不确定你想要实现什么,但如果你想改变复选框的布局,最简单的方法就是创建你自己的风格。

使用Visual Studio,您可以右键单击"文档大纲"面板并选择"编辑模板" > "编辑副本"。 这将允许您复制复选框样式并将其调整为您需要的样式。

Document outline panel

以下是CheckBox样式的示例:

<Style x:Key="CheckBoxStyle1" TargetType="CheckBox">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
    <Setter Property="Padding" Value="8,5,0,0"/>
    <Setter Property="HorizontalAlignment" Value="Left"/>
    <Setter Property="VerticalAlignment" Value="Center"/>
    <Setter Property="HorizontalContentAlignment" Value="Left"/>
    <Setter Property="VerticalContentAlignment" Value="Top"/>
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
    <Setter Property="MinWidth" Value="120"/>
    <Setter Property="MinHeight" Value="32"/>
    <Setter Property="UseSystemFocusVisuals" Value="True"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="CheckBox">
                <Grid BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="20"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <VisualStateManager.VisualStateGroups>
                [...]
                </VisualStateManager.VisualStateGroups>
                <Grid Height="32" VerticalAlignment="Top">
                    <Rectangle x:Name="NormalRectangle" Fill="Transparent" Height="20" Stroke="{ThemeResource SystemControlForegroundBaseMediumHighBrush}" StrokeThickness="{ThemeResource CheckBoxBorderThemeThickness}" UseLayoutRounding="False" Width="20"/>
                    <FontIcon x:Name="CheckGlyph" Foreground="{ThemeResource SystemControlHighlightAltChromeWhiteBrush}" FontSize="20" FontFamily="{ThemeResource SymbolThemeFontFamily}" Glyph="&#xE001;" Opacity="0"/>
                </Grid>
                <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" Grid.Column="1" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" TextWrapping="Wrap" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    </Style>
</Page.Resources>