Place the texts ( TextBox ) and the image ( Image ) in the Grid to create the desired layout. Resizing will happen automatically.
Then bind the Visibility property of each of your texts and your image to the property of some object that saves the selected state in options. (The best solution is to store this information in some new class and assign an instance of this class to the DataContext your window.
For each of the bindings, create a value converter that returns Visibility.Visible or Visibility.Collapsed , based on whether the corresponding element should be visible or invisible with the current settings.
EDIT: Here is an example code:
Assuming your very simple settings object is as follows:
public enum GuiMode { FourTexts, ThreeTexts, OneText, ThreeTextsAndImage } public class GuiSettings : INotifyPropertyChanged { public PropertyChangedEventHandler PropertyChanged; protected void OnPropertyChanged(string propertyName) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); } } private GuiMode mode = GuiMode.FourTexts; public GuiMode Mode { get { return mode; } set { if (mode != value) { switch (value) { case GuiMode.FourTexts: case GuiMode.ThreeTexts: case GuiMode.OneText: case GuiMode.ThreeTextsAndImage: mode = value; OnPropertyChanged("Mode"); break; default: throw new InvalidEnumArgumentException("value", (int)value, typeof(GuiMode)); } } } } }
This is where your GUI mode is stored. Pay attention to the implementation of INotifyPropertyChanged , so when binding to the Mode property, changes to the Mode property will automatically update everything related to it.
Then, for example, for text2, you can write the following value converter:
public class Text2VisibilityConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { switch ((GuiMode)value) { case GuiMode.OneText: return Visibility.Collapsed; default: return Visibility.Visible; } } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotSupportedException("This converter does not convert back."); } }
Since text2 is always displayed, except when only one text is GuiMode.OneText - GuiMode.OneText -, the corresponding Visibility values are returned by the converter. Also note that this converter simply assumes that the input value is a GuiMode value. To do this correctly, you need to check what you get in value as well as targetType .
Once this is done, you can import the converter as a static resource into your Xaml:
<Window.Resources> <Text2VisibilityConverter x:Key="text2vis"/> </Window.Resources>
Depending on which imported namespaces you may need to add the appropriate namespace prefix before Text2VisibilityConverter there.
The Visibility property of your text2 can be attached to the Mode property of the GuiSettings class using Text2VisibilityConverter , assuming that the GuiSettings instance in which you save your settings has been assigned the DataContext property in the window:
<TextBlock Text="Text 2" Visibility="{Binding Mode, Converter={StaticResource text2vis}}"/>
Once this works, you can add additional value conversion classes to make other controls visible.