2016-06-26 37 views
6

Come posso rendere CheckBox vuoto? Ho solo bisogno del segno di spunta. Ora ci vuole spazio vuoto aggiuntivo, come qui:UWP, XAML - rendere CheckBox vuoto

I don't want that empty aqua-color space

<CheckBox 
Background="Aqua" 
Margin="0,0,0,0"/> 

(ho aggiunto il colore di guardare la quantità di spazio questo controllo richiederà (quello spazio vuoto causa problemi alligning)).

Ho solo bisogno del rettangolo tick, non voglio lo spazio vuoto. Come posso ottenerlo?

Impostare Margine su zeri e Contenuto su "" non funziona.

risposta

14
  1. Se si desidera solo per rimuovere lo spazio vuoto sulla destra, è possibile farlo con l'aggiunta di imbottitura e MinWidth a 0:

    <CheckBox Background="Aqua" Padding="0" MinWidth="0"/> 
    

sembra come di seguito:

enter image description here

  1. Se si desidera anche per rimuovere lo spazio in alto e in basso, sono necessari ulteriori lavori:

    • 2a. Seleziona il CheckBox in Document Outline in Visual Studio
    • 2b. Fare clic con il tasto destro su CheckBox -> Modifica modello -> Modifica una copia
    • 2c. Quindi puoi vedere modificare direttamente lo stile CheckBox
    • 2d. Quindi individuare il seguente codice nel ControlTemplate

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

Come si può vedere il rettangolo è 20x20, ma hanno una griglia contenitore con 32 di altezza. Basta modificare l'altezza della griglia 32-20 apparirà come di seguito:

enter image description here

Oh aspetta, perché è ancora hanno un'altezza di 32? È perché hanno MinWidth e MinHeight set in stile

<Setter Property="MinWidth" Value="120"/> 
<Setter Property="MinHeight" Value="32"/> 

Infine, è possibile ripristinare direttamente sia il valore a 0 qui, o semplicemente impostare il MinHeight esterno come nella Fase 1.

enter image description here

+0

Grazie! Funziona :) Ho solo bisogno di rimuovere lo spazio vuoto sulla destra – michalsol

Problemi correlati