View ModelへのUWP Gridviewバインディング

Question

私はUserControlでGridViewを使用して、レッスンの選択を可能にする5×4つの四角形のグラフィックボタンを表示しています。

これはWindows 8.1 Store Appにあり、Windows 10 UWPにアップグレードしています。

これまで、TapとRight-Tapアクションを使用してレッスンを選択したり、CommandBarをアクティブにしてSelectionChangedイベントを通じてレッスンに関連するアクションを実行しました。しかし、Windows 10でインタラクションがどのように動作するかについての変更がありました。私は、SelectedItemをビューモデルの選択されたレッスンボタンにバインドしたり、SelectionChangedイベントやItemClickイベントをバインドしてGridviewを動作させることができませんでした。いったん項目が選択されると、選択解除されないので、Gridviewの選択動作は機能しません。最後に、私は別のタックを取って、GridviewアイテムのTapとRight-Tapイベントを試しています。しかし、問題は、どのように私がそれにアプローチしても、Bindingが正しく機能するようにすることはできません。

は、だから私はLessonButtonと呼ばれるオブジェクトがあります。

public class LessonButton : INotifyPropertyChanged 
{ 
    //public LessonButton() { } 
    public LessonButton(SolidColorBrush inBackground, bool inComplete, double inHeight, int inNumber, bool inSelected, bool inStarted, 
     Status inState, double inWidth) 
    { 
     ... 
     Started = inStarted; 
     ... 
    } 
    ... 
    private bool _started; 
    public bool Started 
    { 
     get { return _started; } 
     set { if (_started != value) { _started = value; OnPropertyChanged(); } } 
    } 
    ... 
    public event PropertyChangedEventHandler PropertyChanged; 
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null) 
    { 
     var handler = PropertyChanged; 
     handler?.Invoke(this, new PropertyChangedEventArgs(propertyName)); 
    } 
} 

これは、ビューモデルで観察可能なコレクションに追加された：私はとのDataContextを設定し、ユーザーコントロールで

public class LessonsViewModel : INotifyPropertyChanged 
{ 
    public ObservableCollection<LessonButton> Lessons { get; } = new ObservableCollection<LessonButton>(); 

    private LessonButton _selectedLessonButton; 

    public LessonButton SelectedLessonButton 
    { 
     get { return _selectedLessonButton; } 
     set { if (_selectedLessonButton != value) { _selectedLessonButton = value; OnPropertyChanged(); } } 
    } 

    public event PropertyChangedEventHandler PropertyChanged; 

    protected void OnPropertyChanged([CallerMemberName] string propertyName = null) 
    { 
     var handler = PropertyChanged; 
     handler?.Invoke(this, new PropertyChangedEventArgs(propertyName)); 
    } 
} 

：

<UserControl.DataContext> 
    <classes:LessonsViewModel/> 
</UserControl.DataContext> 

。そして、私はGridViewを次のように定義しています。

 <GridView x:Name="LessonGridView" ItemContainerStyle="{StaticResource GridViewItemStyle}" ItemsSource="{Binding Lessons}" 
       SelectionMode="Single" IsItemClickEnabled="False" SelectedItem="{Binding Path=SelectedLessonButton, Mode=TwoWay}"> 
     <GridView.ItemsPanel> 
      <ItemsPanelTemplate> 
       <VariableSizedWrapGrid HorizontalChildrenAlignment="Left" MaximumRowsOrColumns="5" Orientation="Horizontal" VerticalChildrenAlignment="Top"/> 
      </ItemsPanelTemplate> 
     </GridView.ItemsPanel> 
    </GridView> 

GridViewItemStyleの一部としてControlTemplateで定義されたGridViewアイテムフォーマット。

私はバインドとxBindを使用して、さまざまな方法でLessonButton変数にアクセスしようとしましたが、唯一このXAMLを使ったControlTemplateを使用して実行するプログラムを得ることができる

：

<Image Grid.Row="1" Grid.Column="1" Width="{StaticResource BadgeSize}" 
    Height="{StaticResource BadgeSize}" HorizontalAlignment="Right" VerticalAlignment="Top" 
    Opacity="{Binding Started, Converter={StaticResource OpacityConverterTrueValueIsVisible}}" 
    Source="/Assets/SelectionButtonGroup/square310x310logobw.png" Stretch="Uniform"/> 

Converterは単に1かを返します。 boolの値に応じて0が開始されます。

このコードは機能しますが、何らかの理由でVisual Studioが不明なエラーを報告し、Startedプロパティを見つけることができないことを示します。実際には、それはLessonButtonのプロパティのいずれかを見つけることができないと私もxと共に、それらを露出させるための正しい構文を見つけることができませんしてきた：バインドコードのような：

{x:Bind LessonViewModel.Lessons.LessonButton.Selected} 

..orバージョンその、

私は前述のエラーを報告し、ControlTemplate全体に波線を表示し、このコードに関連しない別のコンバータアーティファクトを見つけることができないエラーを表示します。それ自体、私は非常に刺激的だと思う。それは私ですか、あるいはVSのXAML Intellisenceが本当のものの根本的な原因を特定できない場合、間違ったエラーをあきらめて報告するという点で、非常にばかげているようです。

理想的には、GridView SelectedItemをViewModelとバインドしたいと思います。しかし、Tapイベントを使ってアクションを試みても、ControlTemplate XAMLのLessonButtonプロパティが正しく表示されるようにバインドすることはできません。

ご協力いただければ幸いです。

Answer 1

変数をLessonButtonにバインドする場合は、ItemContainerStyleを使用しないでください。次に、あなたのDataTemplateを与える

<Grid> 
    <Grid.Resources> 
    <DataTemplate x:Name="GridViewTemplate"> 
     <TextBlock Text="{Binding LessonName}"> 
    </DataTemplate> 
    </StackPanel.Resources> 
    <GridView x:Name="GridView" 
      ItemsSource="{Binding Lessons}" 
      ItemTemplate="{StaticResource GridViewTemplate}"> 
    </GridView> 
</Grid> 

：ItemContainerStyleは、あなたが代わりにそのようなDataTemplateあなたUserControlの内部に格納されたリソースを使用する必要があります

選択マーク、そのホバーと押された状態などで項目のスタイルを設定するために使用されます（ "GridViewTemplate"より上の）名前を入力し、GridViewのItemTemplateと設定します。