I'm working on my first UWP app and I want create a UI like this . For each list item (project) there'll be a set of buttons. For certain list items(projects) some of these buttons will be disabled some times. So I need to disable and change the image for such button in those list items(projects).
我尝试使用这样的列表视图来实现它。但我不确定如何根据情况启用/禁用其中一些按钮。
尝试添加 DataContextChanged 事件并尝试访问那里的按钮。但不确定如何访问这些按钮。
请让我知道以下方法是否正确,或者是否有更好的方法来实现我在上图中想要实现的目标。
<ListView x:Name="stepsListView" Margin="10,0,0,0" RequestedTheme="Dark" FontSize="24" Background="{StaticResource procedure_app_white}" Foreground="Black" BorderThickness="1.5" BorderBrush="Transparent" ItemsSource="{Binding projectList}" HorizontalAlignment="Left">
<ListView.ItemContainerStyle>
<Style TargetType="ListViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
</Style>
</ListView.ItemContainerStyle>
<!-- Item -->
<ListView.ItemTemplate>
<DataTemplate>
<Border BorderThickness="0,0,0,1" BorderBrush="#c0c0c0">
<Grid Width="auto" HorizontalAlignment="Stretch" DataContextChanged="Grid_DataContextChanged" >
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>
<TextBlock VerticalAlignment="Center" FontSize="30" Grid.Row="0" Grid.ColumnSpan="7" Text="{Binding projectName}" Foreground="{StaticResource procedure_app_orange_text }" />
<Button x:Name="warningButton" Width="40" Height="40" Grid.Column="1" Grid.Row="1" Tag="{Binding projectId}" Click="warningButtonClick" Foreground="{StaticResource procedure_app_orange_text }">
<Button.Background>
<ImageBrush ImageSource="Asset/step_ncwr.png">
</ImageBrush>
</Button.Background>
</Button>
<Button x:Name="commentButton" Width="40" Height="40" Grid.Column="2" Grid.Row="1" Tag="{Binding projectId}" Click="CommentButtonClick" Foreground="{StaticResource procedure_app_orange_text }" IsTapEnabled="True">
<Button.Background>
<ImageBrush ImageSource="Asset/step_comment.png">
</ImageBrush>
</Button.Background>
</Button>
<Button x:Name="imageButton" Width="40" Height="40" Grid.Column="3" Grid.Row="1" Tag="{Binding projectId}" Click="ImageButtonClick" Foreground="{StaticResource procedure_app_orange_text }">
<Button.Background>
<ImageBrush ImageSource="Asset/step_image.png">
</ImageBrush>
</Button.Background>
</Button>
</Grid>
</Border>
</DataTemplate>
</ListView.ItemTemplate>
答案是取决于你所采用的结构的变量,所以我将做出一些假设并顺其自然。
首先我假设你的ViewModel
has an ObservableCollection
called ProjectList
并且这个ProjectList
由。。。制成由。。。做成ProjectModel
's
项目模型.cs
public class ProjectModel : INotifyPropertyChanged{
private bool _isNcwrEnabled;
public bool IsNcwrEnabled{
get{ return _isNcwrEnabled; }
set{ _isNcwrEnabled = value; OnPropertyChanged("IsNcwrEnabled"); }
}
private bool _isCommentEnabled;
public bool IsCommentEnabled{
get{ return _isCommentEnabled; }
set{ _isCommentEnabled= value; OnPropertyChanged("IsCommentEnabled"); }
}
private bool _isImageEnabled;
public bool IsImageEnabled{
get{ return _isImageEnabled; }
set{ _isImageEnabled= value; OnPropertyChanged("IsImageEnabled"); }
}
public void OnPropertyChanged(String prop)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(prop));
}
}
public event PropertyChangedEventHandler PropertyChanged;
}
In your ViewModel
你应该有
ObservableCollection<ProjectModel> ProjectList {get; private set; }
终于在你的View
<Button IsEnabled="{Binding IsNcwrEnabled}" x:Name="warningButton" Width="40" Height="40" Grid.Column="1"
Grid.Row="1" Tag="{Binding projectId}" Click="warningButtonClick"
Foreground="{StaticResource procedure_app_orange_text }">
<Button.Background>
<ImageBrush ImageSource="Asset/step_ncwr.png"/>
</Button.Background>
</Button>
<Button IsEnabled="{Binding IsCommentEnabled}" x:Name="commentButton" Width="40" Height="40" Grid.Column="2"
Grid.Row="1" Tag="{Binding projectId}" Click="CommentButtonClick"
Foreground="{StaticResource procedure_app_orange_text }" IsTapEnabled="True">
<Button.Background>
<ImageBrush ImageSource="Asset/step_comment.png"/>
</Button.Background>
</Button>
<Button IsEnabled="{Binding IsImageEnabled}" x:Name="imageButton" Width="40" Height="40" Grid.Column="3"
Grid.Row="1" Tag="{Binding projectId}" Click="ImageButtonClick"
Foreground="{StaticResource procedure_app_orange_text }">
<Button.Background>
<ImageBrush ImageSource="Asset/step_image.png"/>
</Button.Background>
</Button>
变更摘要
- 您收藏的模型
ListView
必然需要包含您的启用属性Buttons
绑定到
- In your
View
,绑定你的Buttons
到您的新房产
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)