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

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

新規登録して質問してみよう
ただいま回答率
85.50%
C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

Xamarin

Xamarin(ザマリン)は、iPhoneなどのiOSやAndroidで動作し、C# 言語を用いてアプリを開発できるクロスプラットフォーム開発環境です。Xamarin Studioと C# 言語を用いて、 iOS と Android の両方の開発を行うことができます。

Q&A

解決済

2回答

2783閲覧

カスタムビューから別ビューの呼び出し

randr

総合スコア202

C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

Xamarin

Xamarin(ザマリン)は、iPhoneなどのiOSやAndroidで動作し、C# 言語を用いてアプリを開発できるクロスプラットフォーム開発環境です。Xamarin Studioと C# 言語を用いて、 iOS と Android の両方の開発を行うことができます。

0グッド

0クリップ

投稿2016/12/23 01:51

現在作成したもの

Xamarin.FormsでTabbedPageを使用して複数ページ用意しています。
また、カスタムビューを作成しています。

C#

1public class MyView :Frame 2 { 3 public MyView(int id, string msg) 4 { 5 var label = new Label 6 { 7 Text = msg, 8 HorizontalOptions = LayoutOptions.Center, 9 VerticalOptions = LayoutOptions.Center, 10 }; 11 12 var tgr = new TapGestureRecognizer(); 13 tgr.Tapped += delegate { 14 //別のViewを出す 15 }; 16 17 GestureRecognizers.Add(tgr); 18 19 HasShadow = true; 20 Content = label; 21 } 22 } 23 24 public class MyPage : ContentPage 25 { 26 public MyPage() 27 { 28 var stack = new StackLayout 29 { 30 HorizontalOptions = LayoutOptions.FillAndExpand, 31 VerticalOptions = LayoutOptions.FillAndExpand, 32 Padding = 10, 33 Spacing = 10, 34 }; 35 36 var scroll = new ScrollView 37 { 38 Content = stack, 39 }; 40 41 for (int i = 1; i <= 5; i++) 42 { 43 stack.Children.Add(new MyView(i, $"追加したアイテム/{i}")); 44 } 45 46 Content = scroll; 47 } 48 }

やりたいこと

このMyPageや単独でMyViewが1つあるページがTabbedPageで複数あったとして、MyViewをタップした時に詳細ページを現在のページの上に下からスライドして出したいです。

現在表示しているものの上に重ねて表示しようとすると、AbsoluteLayoutなどを使用するイメージがありますが、やはりその方法しかないでしょうか?

そうなると、呼び出しもとのPageを渡すなり、MyView側にイベントを用意して呼び出し側で詳細ページを表示する必要があると考えました。

それでは効率が悪いので、できたらMyView側で定義して、呼び出し側は上記のコードのようにViewを表示するだけにしたいのですが、どのような方法が考えられますか?

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

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

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

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

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

guest

回答2

0

ベストアンサー

Android でしか試していないのですが... (追記: iOS でも動きました。)

「下からスライド」ということですが、モーダルで画面遷移するとそのような表示になります。そもそもモーダルでよいのか分かりませんが...

App クラスは次のようになっているということにします。

c#

1 public App() 2 { 3 var tabbed = new TabbedPage(); 4 tabbed.Children.Add(new MyPage { Title = "ページ1" }); 5 tabbed.Children.Add(new MyPage { Title = "ページ2" }); 6 MainPage = tabbed; 7 }

ContentPage を継承して ModalPage というクラスを作っておいて、次のように呼び出します。

c#

1 tgr.Tapped += delegate { 2 //別のViewを出す 3 var modal = new ModalPage(); 4 5 Navigation.PushModalAsync(modal); 6 };

Android ならバックボタンで戻れますが、iOS ではどうやって戻るのでしょうね。とりあえず PopModalAsync() を呼ぶボタンを ModalPage の中に付けるのが簡単そうです。

c#

1 stack.Children.Add(new Button 2 { 3 Text = "閉じる", 4 Command = new Command(() => Navigation.PopModalAsync()) 5 });

あるいは、ツールバーにボタンを置く形にしたいなら NavigationPage を挟むことになるみたいです。

c#

1 tgr.Tapped += delegate { 2 //別のViewを出す 3 var modal = new ModalPage(); 4 5 //Navigation.PushModalAsync(modal); 6 modal.ToolbarItems.Add(new ToolbarItem 7 { 8 Text = "閉じる", 9 Command = new Command(() => Navigation.PopModalAsync()) 10 }); 11 Navigation.PushModalAsync(new NavigationPage(modal)); 12 };

c#

1 public class ModalPage : ContentPage 2 { 3 public ModalPage() 4 { 5 var stack = new StackLayout 6 { 7 HorizontalOptions = LayoutOptions.FillAndExpand, 8 VerticalOptions = LayoutOptions.FillAndExpand, 9 Padding = 10, 10 Spacing = 10, 11 }; 12 13 var scroll = new ScrollView 14 { 15 Content = stack 16 }; 17 18 Title = "モーダル ページ"; 19 stack.Children.Add(new Label { Text = "テキスト" }); 20 //stack.Children.Add(new Button 21 //{ 22 // Text = "閉じる", 23 // Command = new Command(() => Navigation.PopModalAsync()) 24 //}); 25 26 Content = scroll; 27 } 28 }

投稿2016/12/25 15:19

編集2016/12/26 09:41
NakamuraYoichi

総合スコア374

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

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

0

TabbedPageの中に直接子Pageを入れるのではなく、NavigationPageを入れることでタブの中で画面遷移することが可能になります。
あとはアニメーションですが、遷移時のアニメーションを変更することは私はやった事がありません。
CustomRendererを利用する方法などもあるようですが、こちらが利用できないでしょうか?
試していませんので、意図通りの事が実現できるかどうかは、分かりかねますが(´・ω・`)

https://github.com/AlexandrNikulin/AnimationNavigationPage

投稿2016/12/23 02:52

nuits.jp

総合スコア346

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問