調整Windows通用應用程序中的複選框

Question

我在項目中擁擠了頁面，我想在單個頁面中放置太多的複選框控件，所以我正在尋找一種方法來調整我的複選框。 當我改變我的複選框的高度和寬度，其文本的一部分消失，換句話說，我需要縮放我的複選框，並使一些小複選框。

Answer 1

當然你也可以通過使用ScaleTransform但修改其風格，使您更多的靈活性規模下來。

下面是一個例子 -

<Style x:Key="TinyCheckBoxStyle" 
       TargetType="CheckBox"> 
      <Setter Property="Padding" 
        Value="4,0,0,0" /> 
      <Setter Property="HorizontalContentAlignment" 
        Value="Left" /> 
      <Setter Property="FontSize" 
        Value="11" /> 
      <Setter Property="MinWidth" 
        Value="0" /> 
      <Setter Property="MinHeight" 
        Value="0" /> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="CheckBox"> 
         <Grid x:Name="RootGrid" 
           BorderBrush="{TemplateBinding BorderBrush}" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           Background="{TemplateBinding Background}"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="Auto" /> 
           <ColumnDefinition Width="*" /> 
          </Grid.ColumnDefinitions> 

          <VisualStateManager.VisualStateGroups> 
           <!-- Add default visual states back in here --> 
          </VisualStateManager.VisualStateGroups> 

          <Grid> 
           <Rectangle x:Name="NormalRectangle" 
              Fill="{ThemeResource CheckBoxCheckBackgroundFillUnchecked}" 
              Height="12" 
              Stroke="{ThemeResource CheckBoxCheckBackgroundStrokeUnchecked}" 
              StrokeThickness="{ThemeResource CheckBoxBorderThemeThickness}" 
              UseLayoutRounding="False" 
              Width="12" /> 
           <FontIcon x:Name="CheckGlyph" 
              Foreground="{ThemeResource CheckBoxCheckGlyphForegroundUnchecked}" 
              FontSize="{TemplateBinding FontSize}" 
              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> 

基本上，你需要減少NormalRectangle，CheckGlyph和FontSize大小。注意我已經刪除了視覺狀態來簡化答案，您只需要將它們從default style中添加回來即可。