#1,030 – Displaying an Indeterminate Progress Bar

When you display a ProgressBar to show progress on some background task, you often know how much work needs to be done and how much of the work has already been done.  The ProgressBar below shows that we’ve loaded 5 out of 12 records, so the ProgressBar is 42% full.

1074-001

In other cases, you may want to use a ProgressBar to show the user that something is happening, but you might not know how long the operation will take or how much of the total work has already been done.  In these cases, you can display an “indeterminate” progress bar by setting the IsIndeterminate property to true.  A green bar will repeatedly slide across the face of the ProgressBar to show that something is happening.

        <ProgressBar IsIndeterminate="True"
                     Height="15" Margin="15,15,15,0"/>
        <Label Content="Connecting to database..."
               Margin="10,0"/>

1030-001
When the operation is done, you can just set IsIndeterminate to false and set Value to 0.

#854 – Clicked vs. Checked/Unchecked Events for CheckBox

If you want to add an event handler for a CheckBox that gets executed whenever a user clicks on the CheckBox, you can take one of two different approaches:

  • Add a handler for the Click event and then check the IsChecked property to discover the new state (checked / unchecked / indeterminate)
  • Handle one or more of the specific events for the individual states–Checked, Unchecked or Indeterminate

When a user clicks on the CheckBox, the specific event (e.g. Checked) is fired, followed by the Click event.

        private void CheckBox_Click(object sender, RoutedEventArgs e)
        {
            CheckBox cb = sender as CheckBox;
            string checkState;

            if (!cb.IsChecked.HasValue)
                checkState = "Indeterminate";
            else
            {
                if (cb.IsChecked == true)
                    checkState = "Checked";
                else
                    checkState = "Unchecked";
            }

            Trace.WriteLine(string.Format("Click event: {0}", checkState));
        }

        private void CheckBox_Checked(object sender, RoutedEventArgs e)
        {
            Trace.WriteLine("Checked event");
        }

        private void CheckBox_Unchecked(object sender, RoutedEventArgs e)
        {
            Trace.WriteLine("Unchecked event");
        }

        private void CheckBox_Indeterminate(object sender, RoutedEventArgs e)
        {
            Trace.WriteLine("Indeterminate event");
        }

854-001

#354 – Use Three-State CheckBox to Show State of Other CheckBoxes

Three-state CheckBox controls are often used in conjunction with other CheckBox controls. The three-state CheckBox appears checked if all other checkboxes are checked, unchecked if nothing else is checked, or the indeterminate state if some other CheckBox controls are checked.

Here’s an example, starting with the XAML:

        <CheckBox Content="Do Everything" IsChecked="{Binding DoEverything}" IsThreeState="True"/>
        <CheckBox Content="Eat" IsChecked="{Binding DoEat}" Margin="20,0,0,0"/>
        <CheckBox Content="Pray" IsChecked="{Binding DoPray}" Margin="20,0,0,0"/>
        <CheckBox Content="Love" IsChecked="{Binding DoLove}" Margin="20,0,0,0"/>

At run-time, you want the following behavior:

  • User checks Do Everything, all other items become checked

  • User unchecks Do Everything, all other items become unchecked

  • User checks individual items, Do Everything becomes checked if everything else is checked, unchecked if nothing is checked, or indeterminate if at some items are checked

See post #355 for an example of the code-behind that implements this behavior.

 

 

#352 – Use IsThreeState Property to Create a CheckBox that Has an Indeterminate State

The CheckBox control normally has two states–checked or unchecked.  The current state can be determined by reading the IsChecked property, which can take on the values true and false.

You can also use a CheckBox to represent an indeterminate value–a value that is neither true nor false.  To indicate that a CheckBox can have three states (checked, not checked and indetermine), set the IsThreeState property to true.

        <CheckBox Content="Happy" IsThreeState="True"/>

At run-time, you’ll notice that the CheckBox will cycle through the three states. A solid box rather than a check mark indicates the indeterminate state.

In code, you can read the IsChecked property to determine the state.  IsChecked is a nullable bool and can have one of the values:

  • true  (checked)
  • false  (not checked)
  • null  (indeterminate)