creating dynamic controls with MVVM

Question

I am trying to create a dynamic control with using mvvm for the first time. I want to generate buttons dynamically and have the content display inside of the buttons. I am sure I am missing something really easy here, but I have no idea what it could be. When I run the code, nothing appears on the interface, though I can see AvailableMonitorOC populate in the constructor...

Here is my ViewModel where I manually add buttons to an observable collection for simplicity sake of this example:

public class CreateAndDisplayViewModel {
    public ObservableCollection<AvailableMonitorBo> AvailableMonitorOC = new ObservableCollection<AvailableMonitorBo>();

    public CreateAndDisplayViewModel() {           
        availableMonitorBo = new AvailableMonitorBo();

        availableMonitorBo.AvailableMonitorLabel = "Label 1";
        AvailableMonitorOC.Add(availableMonitorBo);

        availableMonitorBo.AvailableMonitorLabel = "Label 2";
        AvailableMonitorOC.Add(availableMonitorBo);
    }

    private AvailableMonitorBo availableMonitorBo;
    public AvailableMonitorBo AvailableMonitorBo {
        get { return availableMonitorBo; }
        set {
            availableMonitorBo = value;
        }
    }
}

Here is my model:

 public class AvailableMonitorBo : INotifyPropertyChanged {

        private string availableMonitorLabel { get; set; }
        public string AvailableMonitorLabel {
            get { return availableMonitorLabel; }
            set {
                availableMonitorLabel = value;
                OnPropertyChanged("AvailableMonitorLabel");
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void OnPropertyChanged(string propertyName) {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null) {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }

And here is the xaml:

 <ListView Grid.Row="2" Grid.Column="1"                        
           ItemsSource="{Binding AvailableMonitorOC, Mode=TwoWay}">
                <ListView.ItemTemplate>
                    <DataTemplate>              
                            <StackPanel>                              
                                <Button Content="{Binding AvailableMonitorLabel}"
                                        Width="100"
                                        Height="25"/>
                            </StackPanel>           
                    </DataTemplate>
      </ListView.ItemTemplate>
 </ListView>

Peregrine · Accepted Answer · 2018-09-17 16:07:56Z

1

The main reason for you lack of display is that AvailableMonitorOC needs to be a property of CreateAndDisplayViewModel, not a field as it is currently.

You're also only creating one AvailableMonitorBo instance and changing its caption each time.

answered Sep 17, 2018 at 16:07

Peregrine

4,6113 gold badges22 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

creating dynamic controls with MVVM

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related