简体   繁体   中英

Binding from style template

Here is what I am trying to accomplish - I have an Item control with its item source set to ObservableCollection Each item in this collection is used as a viewModel to create different buttons in ItemControl. I would like to know how can I bind to a property of this viewmodel(PersonViewModel) from button style template? Lets say, I want to control visibility of a specific element in my custom button with a property defined in PersonViewModel. Here is a little sample code:

public class MainViewModel : ViewModelBase
{
    private ObservableCollection<PersonViewModel> _personViewModelList;
    public ObservableCollection<PersonViewModel> PersonViewModelList
    {
        get => _personViewModelList;
        set
        {
            _personViewModelList= value;
            OnPropertyChanged("PersonViewModelList");
        }
    }
}
public class PersonViewModel 
{
  private bool _visible;
  public bool Visible
    {
        get => _visible;
        set
        {
            _visible= value;
            OnPropertyChanged("Visible");
        }
    }
 }

Here is my item control:

<ItemsControl ItemsSource="{Binding PersonViewModelList}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <WrapPanel Width="360" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>

        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Button 
                    Style="{StaticResource ImageButton}">                       
                </Button>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
</ItemsControl>

And here is my custom button style:

<Style x:Key="ImageButton" TargetType="Button">
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="20" />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="20" />
                                <ColumnDefinition Width="20" />
                            </Grid.ColumnDefinitions>
//Here I want to bind to "Visible" property in PersonViewModel class. Any ideas on how to accomplish it?
                            <TextBlock Visibility="{Binding...}" Grid.Row="0" Grid.Column="1"  />
                        </Grid>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
    </Style>

You could use something like this:

<TextBlock Visibility="{Binding DataContext.Visible, Converter={StaticResource BooleanToVisibilityConverter}, RelativeSource={RelativeSource  Mode=FindAncestor, AncestorType=Button}}" Grid.Row="0" Grid.Column="1"  />

The problem is that the ContentPresenter of your Button has DataContext = null.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM