質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Windows 10

Windows 10は、マイクロソフト社がリリースしたOSです。Modern UIを標準画面にした8.1から、10では再びデスクトップ主体に戻され、UIも変更されています。PCやスマホ、タブレットなど様々なデバイスに幅広く対応していることが特徴です。

UWP

UWPは、Universal Windows Platformの略。様々なデバイス向けに提供されているアプリケーションを共通のフレームワーク上で動作可能にする仕組みで、Windows10で導入されました。

XAML

XAML(Extensible Application Markup Language)はWPF、Silverlight、Windows PhoneそしてWindows Store appsでユーザーインターフェースを定義するために使われるXML言語です。

バインド

バインドは、一定の方法で複数の事柄が関連付けられている状態を呼びます。また、そのような関連付けを実行する機能自体を指す事もあります。

継承

継承(インヘリタンス)はオブジェクト指向プログラミングに存在するシステムです。継承はオブジェクトが各自定義する必要をなくし、継承元のオブジェクトで定義されている内容を引き継ぎます。

Q&A

0回答

649閲覧

UWPでPage内のContentに入れたViewModelを持ったボタンにPageからCommandをバインドさせる方法

hirotamasami

総合スコア5

Windows 10

Windows 10は、マイクロソフト社がリリースしたOSです。Modern UIを標準画面にした8.1から、10では再びデスクトップ主体に戻され、UIも変更されています。PCやスマホ、タブレットなど様々なデバイスに幅広く対応していることが特徴です。

UWP

UWPは、Universal Windows Platformの略。様々なデバイス向けに提供されているアプリケーションを共通のフレームワーク上で動作可能にする仕組みで、Windows10で導入されました。

XAML

XAML(Extensible Application Markup Language)はWPF、Silverlight、Windows PhoneそしてWindows Store appsでユーザーインターフェースを定義するために使われるXML言語です。

バインド

バインドは、一定の方法で複数の事柄が関連付けられている状態を呼びます。また、そのような関連付けを実行する機能自体を指す事もあります。

継承

継承(インヘリタンス)はオブジェクト指向プログラミングに存在するシステムです。継承はオブジェクトが各自定義する必要をなくし、継承元のオブジェクトで定義されている内容を引き継ぎます。

0グッド

0クリップ

投稿2020/11/30 04:52

編集2020/11/30 04:54

前提・実現したいこと

UWPでまず以下のようなPageを作成しました

C#

1<Page 2 x:Class="TestInContentClickBind.Views.ParentPage" 3 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 4 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 5 xmlns:local="using:TestInContentClickBind.Views" 6 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 7 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 8 mc:Ignorable="d"> 9 <Page.DataContext> 10 <local:ParentPageViewModel/> 11 </Page.DataContext> 12 <Grid x:Name="Parent"> 13 <Grid.RowDefinitions> 14 <RowDefinition Height="1*"/> 15 <RowDefinition Height="1*"/> 16 <RowDefinition Height="1*"/> 17 <RowDefinition Height="1*"/> 18 <RowDefinition Height="1*"/> 19 </Grid.RowDefinitions> 20 <Grid Grid.Row="0"> 21 <local:InContentButton VerticalAlignment="Stretch" 22 HorizontalAlignment="Stretch" 23 Background="Pink" 24 Command="{x:Bind ((local:ParentPageViewModel)DataContext).ClickCommand}"/> 25 </Grid> 26 <Grid Grid.Row="1"> 27 <Button VerticalAlignment="Stretch" 28 HorizontalAlignment="Stretch" 29 Background="Yellow" 30 Command="{Binding ClickCommand}"/> 31 </Grid> 32 <Grid Grid.Row="2"> 33 <Button VerticalAlignment="Stretch" 34 HorizontalAlignment="Stretch" 35 Background="Green" 36 Command="{x:Bind ((local:ParentPageViewModel)DataContext).ClickCommand}"/> 37 </Grid> 38 <Grid Grid.Row="3"> 39 <local:ContentControl> 40 <local:ContentControl.Content> 41 <local:InContentButton VerticalAlignment="Stretch" 42 HorizontalAlignment="Stretch" 43 Background="Blue" 44 Command="{x:Bind ((local:ParentPageViewModel)DataContext).ClickCommand}"/> 45 </local:ContentControl.Content> 46 </local:ContentControl> 47 </Grid> 48 <Grid Grid.Row="4"> 49 <local:SuperButton VerticalAlignment="Stretch" 50 HorizontalAlignment="Stretch" 51 Background="Red" 52 Command="{x:Bind ((local:ParentPageViewModel)DataContext).ClickCommand}"/> 53 </Grid> 54 </Grid> 55</Page> 56 57using System; 58using System.Windows.Input; 59using Windows.UI.Xaml.Controls; 60 61namespace TestInContentClickBind.Views 62{ 63 /// <summary>ParentPageViewModel クラスは、ParentPageのViewModelクラスです。</summary> 64 public class ParentPageViewModel 65 { 66 public Page a; 67 68 public ICommand ClickCommand { get; private set; } 69 70 public ParentPageViewModel() 71 { 72 ClickCommand = new RelayCommand(OnButtonClick); 73 } 74 75 private void OnButtonClick() 76 { 77 //クリック時の処理 78 } 79 } 80 81 public class RelayCommand : ICommand 82 { 83 private readonly Action _execute; 84 private readonly Func<bool> _canExecute; 85 86 public event EventHandler CanExecuteChanged; 87 88 public RelayCommand(Action execute) 89 { 90 if (execute == null) 91 throw new ArgumentNullException("execute"); 92 _execute = execute; 93 } 94 95 public bool CanExecute(object parameter) 96 { 97 return _canExecute == null ? true : _canExecute(); 98 } 99 100 public void Execute(object parameter) 101 { 102 _execute(); 103 } 104 105 public void RaiseCanExecuteChanged() 106 { 107 CanExecuteChanged?.Invoke(this, EventArgs.Empty); 108 } 109 } 110}

上記で使用しているコントロールはそれぞれ

C#

1<Button 2 x:Class="TestInContentClickBind.Views.InContentButton" 3 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 4 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 5 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 6 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 7 mc:Ignorable="d"> 8 9 <Button.DataContext> 10 <local:InContentButtonViewModel/> 11 </Button.DataContext> 12 13</Button> 14 15using Windows.UI.Xaml.Controls; 16 17namespace TestInContentClickBind.Views 18{ 19 public sealed partial class InContentButton : Button 20 { 21 public InContentButton() 22 { 23 this.InitializeComponent(); 24 } 25 } 26}

文字数制限のため他割愛

このようになっているとき
どのボタンを押しても
ClickCommandは実行されます。

ここで一定の範囲のみをあとから定義したPageを作成する際
PageにContentを定義しました。

C#

1<Page 2 x:Class="TestInContentClickBind.Views.ContentPage" 3 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 4 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 5 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 6 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 7 mc:Ignorable="d"> 8 9 <Grid> 10 <ContentPresenter Content="{x:Bind MainContent}" /> 11 </Grid> 12 13</Page> 14 15using Windows.UI.Xaml; 16using Windows.UI.Xaml.Controls; 17 18namespace TestInContentClickBind.Views 19{ 20 public partial class ContentPage : Page 21 { 22 public readonly DependencyProperty MainContentProperty = 23 DependencyProperty.Register( 24 nameof(MainContent), 25 typeof(object), 26 typeof(ContentPage), 27 new PropertyMetadata(default(object))); 28 29 public object MainContent 30 { 31 get { return (object)GetValue(MainContentProperty); } 32 set { SetValue(MainContentProperty, value); } 33 } 34 35 public ContentPage() 36 { 37 this.InitializeComponent(); 38 } 39 } 40}

これを用いて
最初のページと同じボタンを以下のように
作成しました。

C#

1<local:Super_ContentPageProfection 2 x:Class="TestInContentClickBind.Views.Super_ContentPage" 3 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 4 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 5 xmlns:local="using:TestInContentClickBind.Views" 6 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 7 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 8 mc:Ignorable="d"> 9 10</local:Super_ContentPageProfection> 11 12namespace TestInContentClickBind.Views 13{ 14 public sealed partial class Super_ContentPage : Super_ContentPageProfection 15 { 16 public Super_ContentPage() 17 { 18 this.InitializeComponent(); 19 } 20 } 21} 22 23<local:ContentPage 24 x:Class="TestInContentClickBind.Views.Super_ContentPageProfection" 25 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 26 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 27 xmlns:local="using:TestInContentClickBind.Views" 28 xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 29 xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 30 mc:Ignorable="d"> 31 32 <local:ContentPage.DataContext> 33 <local:Super_ContentPageViewModel/> 34 </local:ContentPage.DataContext> 35 36 <local:ContentPage> 37 <local:ContentPage.MainContent> 38       <!--文字数制限のため割愛するが、上記ParentPage内のGrid(x:Name Parent)まるまる--> 39 </local:ContentPage.MainContent> 40 </local:ContentPage> 41 42</local:ContentPage> 43 44namespace TestInContentClickBind.Views 45{ 46 public partial class Super_ContentPageProfection : ContentPage 47 { 48 public Super_ContentPageProfection() 49 { 50 this.InitializeComponent(); 51 } 52 } 53} 54 55using System.Windows.Input; 56 57namespace TestInContentClickBind.Views 58{ 59 /// <summary>Super_ContentPageViewModel クラスは、Super_ContentPageのViewModelクラスです。</summary> 60 public class Super_ContentPageViewModel 61 { 62 public ICommand ClickCommand { get; private set; } 63 public Super_ContentPageViewModel() 64 { 65 ClickCommand = new RelayCommand(OnButtonClick); 66 } 67 private void OnButtonClick() 68 { 69 //クリック時の処理 70 } 71 } 72} 73

このように作成した時、
黄色のボタン以外のClickCommandが実行されなくなってしまいました。
デバッグで確認したところ、
CommandにBindされておらずnullだったのですが、
なぜnullになってしまうのでしょうか?

https://teratail.com/questions/300833?nli=5fa3c3ea-0718-470f-aee4-4fda0a040722#reply-425538
で述べられているように
SuperButtonなどのDataContextにViewModelを代入せず、
黄色のボタンと同様に
Command="{Binding ClickCommand}"
とすれば黄色のボタンと同様に
ClickCommandが実行されました。

ですが、上記過去の質問と同様に
DataContextが埋まってる状態で
Commandのみ使用する側から定義したいのですが、
どのようにすればよろしいでしょうか?

宜しくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問