Hide checkbox, but show its content

Question

Is it possible to hide a checkbox, but leave its content visible?

<ListBox  
         ItemsSource ="{Binding MyItemCollection}"     
         SelectionMode="Single" 
         Width="300"
         Height="320">
      <ListBox.ItemTemplate>
          <DataTemplate>
             <CheckBox IsChecked="{Binding IsChecked}">
                   <CheckBox.Content>
                       <TextBlock Text="{Binding Item.Code}"/>
                   </CheckBox.Content>
             </CheckBox>
          </DataTemplate>
      </ListBox.ItemTemplate>
</ListBox>
<StackPanel>
   <CheckBox Content="Edit Mode" 
             IsChecked="{Binding Path=EditModeSelected, Mode=TwoWay}">
   </CheckBox>
</StackPanel>

I would like to hide the checkboxes in the list box when I turn Edit Mode off (so it should be binded to EditModeSelected), but the text should be left visible.

Mukesh Kumar · Accepted Answer · 2015-10-09T11:43:10.277

2

In order to do so You can keep two TextBlocks. In edit mode visible CheckBox and hide TextBlock and in reader mode vice versa. I hope this may help. As DataTemplate can have only one child here's the fix

Create a Window Resource like below. Two Data Templates were created one for edit mode and another for Reader Mode.

<Window.Resources>
    <DataTemplate x:Key="EditModeTemplate">
        <CheckBox IsChecked="{Binding IsChecked}">
            <CheckBox.Content>
                <TextBlock Text="{Binding Item.Code}"/>
            </CheckBox.Content>
        </CheckBox>
    </DataTemplate>
    <DataTemplate x:Key="ReaderModeTemplate">
        <TextBlock Text="{Binding Item.Code}"/>
    </DataTemplate>
</Window.Resources>

Now in .cs file assign the Date Template as per requirements.

if (EditMode)
{
    DemoCollection.ItemTemplate = this.Resources["EditModeTemplate"] as DataTemplate;
}
else
{
    DemoCollection.ItemTemplate = this.Resources["ReaderModeTemplate"] as DataTemplate;
}

edited Oct 09 '15 at 11:43

answered Oct 09 '15 at 11:16

Mukesh Kumar

656
5
26

Mukesh Kumar, thank you, but this causes an error "object 'DataTemplate' already has a child and cannot add 'TextBlock'. 'DataTemplate' can accept only one child." – Dzhara Oct 09 '15 at 11:25
a datatemplate can indeed have only one child. in order to fix this wrap the checkbox and the textblock in a horizontal stackpanel – Philip W Oct 09 '15 at 11:31
@Dzhara, I just wanted to give you the idea about it. Now I've updated the code. Please have a look and let me know if it helps. – Mukesh Kumar Oct 09 '15 at 11:44

score 1 · Answer 2 · edited May 23 '17 at 11:48

3 possible solutions come in my mind - two of them more or less "hacks" and one more or less clean solution:

A checkbox and textblock for every item - you can get problems with margins etc
A checkbox with no content (which is only visible when in edit mode), and a textblock which is always visible
Take the default controltemplate for checkbox (Default ControlTemplate for CheckBox) and bind the visibility of the checkbox

score 0 · Answer 3 · answered Mar 30 '22 at 00:05

Here is a Xaml only solution pulled from a project I am working on. In this case "ShowCheck" is a field in the current binding context saying whether or not to show the check.

<CheckBox Content="{Binding Name}">
    <CheckBox.Style>
        <Style TargetType="CheckBox">
            <Style.Triggers>
                <DataTrigger Binding="{Binding ShowCheck}" Value="False">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="CheckBox">
                                <ContentControl Content="{TemplateBinding Content}"/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </CheckBox.Style>
</CheckBox>

Basically if the checkbox should be invisible, then I use a style and a trigger to change the checkbox's template to something without the checkbox. My implementation the content is just a string, so this works. If you were putting more complicated objects into the checkbox, you might need to shuttle the ContentTemplate, ContentTemplateSelector, and related fields into the ContentControl that is used to replace the checkbox

Hide checkbox, but show its content

3 Answers3