Databases
StackOverflow2013
Postsdbo
POHow to hide and show UserControls based on SelectedItem in ListBox WPF MVVM Model
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to hide and show UserControls based on SelectedItem in ListBox WPF MVVM Model
    primarykey
    data
    text
    <p>I have 3 UserControls in my MainWindow,In my UserControl1 i have a ListBox with some names.The UserControl2 and 3 are not visible when we start the application.</p> <p>When i select some name in the listbox of usercontrol1 then the usercontrol2 should appear on my mainwindow,when i select other name then usercontrol3 should appear on my mainwindow.Struggling with this please help me,i'm new to this</p> <p>This is my UserControlXaml code</p> <pre><code>&lt;UserControl x:Class="Wpf_MVVM.UserControl1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" x:Name="uc1" Height="Auto" Width="Auto"&gt; &lt;Grid&gt; &lt;ListBox Name="listbox" ItemsSource="{Binding mylist}" HorizontalAlignment="Left" Height="310" VerticalAlignment="Top" Width="150" Margin="0,40,0,0" FontSize="15"&gt; &lt;/ListBox&gt; &lt;Label Content="Conversations" HorizontalAlignment="Left" VerticalAlignment="Top" Height="40" Width="150" FontSize="20" Background="SkyBlue"/&gt; &lt;Button Content="Create New Chat" Height="30" HorizontalAlignment="Left" Margin="0,350,0,0" VerticalAlignment="Top" Width="150"/&gt; &lt;/Grid&gt; &lt;/UserControl&gt; </code></pre> <p>This is my .cs code</p> <pre><code>public partial class UserControl1 : UserControl { User1 User1 = new User1(); public UserControl1() { InitializeComponent(); this.DataContext = User1; } } public class User1 { private ObservableCollection&lt;string&gt; _mylist = new ObservableCollection&lt;string&gt;(); public ObservableCollection&lt;string&gt; mylist { get { return _mylist; } } public User1() { mylist.Add("Name1"); mylist.Add("Name2"); mylist.Add("Name3"); mylist.Add("Name4"); } </code></pre> <p>This is my mainwindow.xaml code</p> <pre><code>&lt;Window x:Class="Wpf_MVVM.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:Wpf_MVVM" Title="MainWindow" Background="SlateGray" Height="420" Width="550" &gt; &lt;Window.Resources&gt; &lt;BooleanToVisibilityConverter x:Key="VisibilityConverter" /&gt; &lt;/Window.Resources&gt; &lt;Grid&gt; &lt;local:UserControl1 x:Name="uc1" HorizontalAlignment="Left" VerticalAlignment="Top"/&gt; &lt;StackPanel&gt; &lt;local:UserControl2 x:Name="uc2" Visibility="{Binding SelectedItem, Converter={StaticResource VisibilityConverter}}" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="150,29,0,0" /&gt; &lt;local:UserControl3 x:Name="uc3" Visibility="{Binding SelectedItem1, Converter={StaticResource VisibilityConverter}}" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="340,29,0,0"/&gt; &lt;/StackPanel&gt; &lt;/Grid&gt; &lt;/Window&gt; </code></pre> <p>This is my viewmodel code for usercontrol2 and 3</p> <pre><code> public class User : INotifyPropertyChanged { private bool _selectedItem; public bool SelectedItem { get { return _selectedItem; } set { _selectedItem = value; PropertyChanged(this, new PropertyChangedEventArgs("SelectedItem")); } } private bool _selectedItem1; public bool SelectedItem1 { get { return _selectedItem1; } set { _selectedItem1 = value; PropertyChanged(this, new PropertyChangedEventArgs("SelectedItem1")); } } public class BooleanToVisibilityConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { return value == null ? Visibility.Collapsed : Visibility.Visible; } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { return null; } } public event PropertyChangedEventHandler PropertyChanged; private void Notify(string propertyName) { var handler = PropertyChanged; if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName)); } private readonly ObservableCollection&lt;string&gt; items = new ObservableCollection&lt;string&gt;(); private string text; private readonly ObservableCollection&lt;string&gt; newitems = new ObservableCollection&lt;string&gt;(); private string newtext; public class Command : ICommand { private readonly Action action; public Command(Action action) { this.action = action; } public bool CanExecute(object parameter) { return true; } public event EventHandler CanExecuteChanged; public void Execute(object parameter) { action(); } } private readonly ICommand addCommand; private readonly ICommand sendCommand; public User() { addCommand = new Command(() =&gt; items.Add(Text)); sendCommand = new Command(() =&gt; newitems.Add(NewText)); } public IEnumerable&lt;string&gt; Items { get { return items; } } public IEnumerable&lt;string&gt; NewItems { get { return newitems; } } public ICommand AddCommand { get { return addCommand; } } public ICommand SendCommand { get { return sendCommand; } } public string Text { get { return text; } set { if (text == value) return; text = value; Notify("Text"); } } public string NewText { get { return newtext; } set { if (newtext == value) return; newtext = value; Notify("NewText"); } } } } </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USuser2889489
    1. USuser2889489
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload