动态生成标签单击WPF中的动态生成的RadioButton时

Question

I am a C++ developer and recently moved to wpf. I seem to have across a tricky situation where I have to dynamically generate labels based on radiobutton click. Here I will show you how I have generated 4 radio buttons first.

XAML:

<Grid Grid.Row="0">           

        <ItemsControl ItemsSource="{Binding Children}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Vertical"
                    IsItemsHost="True" />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>

            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <RadioButton Content="{Binding RadioBase}" Margin="0,10,0,0" IsChecked="{Binding BaseCheck}" Height="15" Width="80" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>          

    </Grid>

<Grid Grid.Row="1">
    <Label Content="{Binding name}" HorizontalAlignment="Center" VerticalAlignment="Center" />      
</Grid>

ViewModel:

private bool sBaseCheck;
    public bool BaseCheck
    {
        get { return this.sBaseCheck; }
        set
        {
            this.sBaseCheck = value;                
            this.OnPropertyChanged("BaseCheck");
        }
    }

    private int _ID;
    public int ID
    {
        get
        {
            return _ID;
        }

        set
        {
            _ID = value;
            OnPropertyChanged("ID");
        }
    }

    private string _NAme;
    public string name
    {
        get
        {
            return _NAme;
        }

        set
        {
            _NAme= value;
            OnPropertyChanged("name");
        }
    }

    private string _RadioBase;
    public string RadioBase
    {
        get
        {
            return _RadioBase;
        }

        set
        {
            _RadioBase = value;
            OnPropertyChanged("RadioBase");
        }
    }

AnotherViewModel Class:

public ObservableCollection<FPGAViewModel> Children { get; set; }

    public FPGARadioWidgetViewModel()
    {
        Children = new ObservableCollection<FPGAViewModel>();
        Children.Add(new FPGAViewModel() { RadioBase = "Base 0x0", ID = 0 });
        Children.Add(new FPGAViewModel() { RadioBase = "Base 0x40", ID = 1 });
        Children.Add(new FPGAViewModel() { RadioBase = "Base 0x80", ID = 2 });
        Children.Add(new FPGAViewModel() { RadioBase = "Base 0xc0", ID = 3 });            
    }

This gives me 4 radiobuttons with Content as given above. Now I want to generate 8 labels on each radiobutton click. I had done this in my C++ app as follows:

for(i = 0; i < 0x40 / 8; i++)
{
    reg = (i * 8);
    m_registerLabel[i] = new Label(String::empty, String("Reg 0x") + String::toHexString(reg));
    addAndMakeVisible(m_registerLabel[i]);
}

if you notice, it will create 8 labels with value as Reg 0x0, Reg 0x8, Reg 0x10, Reg 0x18 etc since reg is converted to hexstring. I want to generate something like this when I click Base 0x0 on startup.

How can i achieve this in my app???

Answer 1

In your this.sBaseCheck setter you can do this code.

private bool sBaseCheck;
public bool BaseCheck
{
    get { return this.sBaseCheck; }
    set
    {
        this.sBaseCheck = value;                
        Generatelabels(this)
        this.OnPropertyChanged("BaseCheck");
    }
}

Add 2 new properties...

  private string[] registerLabels = new string[8];
  public string[] RegisterLabels { get { return registerLabels; } }

  private bool isRegisterItemsVisible = false;
  public bool IsRegisterItemsVisible { 
       get { return isRegisterItemsVisible ; }
       set { 
           isRegisterItemsVisible = value; 
           OnPropertyChanged("IsRegisterItemsVisible"); 
           OnPropertyChanged("RegisterLabels"); 
       }
  }

Populate these values...

private static void Generatelabels(FPGAViewModel currentItem)
{
  for(i = 0; i < 0x40 / 8; i++)
  {
       reg = (i * 8);
       currentItem.RegisterLabels[i] = "Reg 0x" + String::toHexString(reg);
       currentItem.IsRegisterItemsVisible = true;
   }
}

On your GUI, bind them with another ItemsControl within ItemTemplate of the existing ItemsControl.

        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <RadioButton 
                       Content="{Binding RadioBase}"
                       Margin="0,10,0,0"
                       IsChecked="{Binding BaseCheck}" 
                       Height="15" Width="80" 
                       HorizontalAlignment="Center" 
                       VerticalAlignment="Center"/>
                    <ItemsControl 
                           Visibility="{Binding IsRegisterItemsVisible,
                                Converter={StaticResource BoolToVisibilityConv}}" 
                           ItemsSource="{Binding RegisterLabels}">   
                       <ItemsControl.ItemTemplate>
                          <DataTemplate>
                             <TextBlock Text="{Binding}"/>
                           </DataTemplate>
                       </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>