Search code examples
avaloniaui

CheckBox without a label


I am trying to use a CheckBox without a label. I have expected that I have only let the Content property be empty and will just get the CheckBox Border, but there is always a space for a possible label included. You can see it, when I color the background: [see the attachement, I dont have privileges yet to post images into the text directly][1]

Then I had a look into CheckBox.axaml. It seems that it is not possible to have a CheckBox without a label:

  <ControlTemplate>
    <Grid x:Name="RootGrid" ColumnDefinitions="20,*">
      <Border x:Name="PART_Border"
              Grid.ColumnSpan="2"
              Background="{TemplateBinding Background}"
              BorderBrush="{TemplateBinding BorderBrush}"
              BorderThickness="{TemplateBinding BorderThickness}" />

      <Grid VerticalAlignment="Top" Height="32">
        <Border x:Name="NormalRectangle"
            BorderThickness="{DynamicResource CheckBoxBorderThemeThickness}"
            UseLayoutRounding="False"
            Height="20"
            Width="20" />

        <Viewbox UseLayoutRounding="False">
          <Panel>
            <Panel Height="16" Width="16" />
            <Path x:Name="CheckGlyph" Stretch="Uniform" VerticalAlignment="Center" />
          </Panel>
        </Viewbox>
      </Grid>
      <ContentPresenter x:Name="ContentPresenter"
                     ContentTemplate="{TemplateBinding ContentTemplate}"
                     Content="{TemplateBinding Content}"
                     Margin="{TemplateBinding Padding}"
                     HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                     VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                     Grid.Column="1" />
      <!-- TODO: TextWrapping="Wrap" on contentpresenter -->
    </Grid>
  </ControlTemplate>

At least I can not see any handling for disabling the label. But I am really suprised about that. I just want to use a CheckBox in a ListBox. I can not believe that I would be the first one, who want to use a CheckBox without a label.

What can I do? I am new to AvaloniaUI - Sorry should I missed something obvious. [1]: https://i.sstatic.net/MGcWW.png


Solution

  • You can always hide the ContentPresenter like that:

    <Window.Styles>
        <Style Selector="CheckBox.noContent /template/ ContentPresenter#ContentPresenter">
            <Setter Property="IsVisible" Value="False"/>
        </Style>
    </Window.Styles>
    
    <StackPanel Background="Red">
        <CheckBox Background="Blue" Content="Test1" IsChecked="True"></CheckBox>
            
        <CheckBox Classes="noContent" Content="Test2" Background="Green" IsChecked="True"></CheckBox>
    
        <CheckBox Classes="noContent" Content="Test3" MinWidth="10" Background="Orange" IsChecked="True"></CheckBox>
    </StackPanel>
    

    This will hide the ContentPresenter for every CheckBox, that has Classes="noContent".

    However from your Screenshot I think what your current problem is, is that CheckBox has a MinWidth=120, so the Background will expand quite a lot further than the Box. As you can see here, the Rectangle itself only has a Width=10. So if you set MinWidth=10, the CheckBox will not be wider than the Rectangle:

    <CheckBox Classes="noContent" Content="Test3" MinWidth="10" Background="Orange" IsChecked="True"></CheckBox>