タイトルバーの戻るボタン
ナビゲーションページにはタイトルと戻るボタンを表示しているヘッダーエリアがあります。このエリア自体をNavigationPage.HasNavigationBarで非表示にすることはできますが,戻るボタンだけを非表示にすることもできます。そんなニーズがあるのかといえば,タイトルは出したいけど戻るボタンは消したいという事ですよね。例えば画面の登録ボタンかキャンセルボタンを明示的にタップさせたいというような場合でしょうか。用途は人それぞれとは思いますが,戻るボタンを消すことができます。戻るボタンを消すにはNavigationPage.HasBackButtonをFalseにすればOKです。
書き方
冒頭の解説だけで実装方法がわかる方もいるかもしれませんが,念のため書き方のレクチャーをしておきます。MenuPageからNoBackButtonPageという新規で作成するページを呼び出すように実装します。これまでの流れではなく,単体で試したい人は,Xamarin.Formsのプロジェクトを作成したときに自動で生成されるMainPageにボタン等を設置して,クリックイベントなどで新規で作成するNoBackButtonPageを呼び出してください。
using System.Collections.Generic; using Xamarin.Forms; using Xamarin.Forms.Xaml; using XSample.Objects; namespace XSample.Pages { [XamlCompilation(XamlCompilationOptions.Compile)] public partial class MenuPage : ContentPage { public MenuPage () { InitializeComponent (); var items = new List(); items.Add(new MenuDto("CarouselMainPage", "カルーセルページ:左右にスワイプしてページを移動する", "mail.png")); items.Add(new MenuDto("NoBackButtonPage", "ナビゲーションの戻るボタンを消す", "mail.png")); MyListView.ItemsSource = items; } private void MyListView_ItemTapped(object sender, ItemTappedEventArgs e) { var item = e.Item as MenuDto; if (item.Title == "CarouselMainPage") { Navigation.PushAsync(new CarouselMainPage()); } else if (item.Title == "NoBackButtonPage") { Navigation.PushAsync(new NoBackButtonPage()); } } } }
NoBackButtonPageの追加
実際に実験するコンテンツページを作成します。自動生成されるXamlのContentPage以降の名前空間がずらりと書かれている部分の最後にNavigationPage.HasBackButton=”False”と記述します。
<?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="XSample.Pages.NoBackButtonPage" NavigationPage.HasBackButton="False"> <ContentPage.Content> <StackLayout> <Button Text="Close" Clicked="Button_Clicked"/> </StackLayout> </ContentPage.Content> </ContentPage>
このままでは,UWPで画面を閉じることができなくなるので,ボタンを一つ設置し,Closeボタンとし,クリックイベントを生成します。
コードビハインド側の実装
コードビハインド側では,ページを閉じる実装のみを行います。
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; using Xamarin.Forms; using Xamarin.Forms.Xaml; namespace XSample.Pages { [XamlCompilation(XamlCompilationOptions.Compile)] public partial class NoBackButtonPage : ContentPage { public NoBackButtonPage () { InitializeComponent (); } private void Button_Clicked(object sender, EventArgs e) { Navigation.PopAsync(); } } }
実行
実行すると,戻るボタンが表示されないことが確認できます。Androidの場合はデバイスの三角ボタンで戻れますが,UWPは戻れなくなるので,Closeボタンをクリックして画面を閉じましょう。
- C#Xamarin.Formsでスマホ開発#01プロジェクト作成の方法
- C#Xamarin.Formsでスマホ開発#02プロジェクトの実行【Android実機編】
- C#Xamarin.Formsでスマホ開発#03エミュレーターでのAndroid接続
- C#Xamarin.Formsでスマホ開発#04 UWPの実行
- C#Xamarin.Formsでスマホ開発#05マルチスタートアッププロジェクトの設定
- C#Xamarin.Formsでスマホ開発#06 StackLayoutの使い方を解説
- C#Xamarin.Formsでスマホ開発#07 VerticalOptionsとHorizontalOptionsの使い方
- C#Xamarin.Formsでスマホ開発#08文字色&背景色とFontsizeの使い方
- C#Xamarin.Formsでスマホ開発#09 Gridの使い方
- C#Xamarin.Formsでスマホ開発#10画面遷移のやり方
- C#Xamarin.Formsでスマホ開発#11 TabbedPageの作り方
- C#Xamarin.Formsでスマホ開発#12 TabbedPageの中身の作り方
- C#Xamarin.Formsでスマホ開発#13 MasterDetailPageの作り方
- C#Xamarin.Formsでスマホ開発#14 ListViewの作り方
- C#Xamarin.Formsでスマホ開発#15 CarouselPageの作り方
- C#Xamarin.Formsでスマホ開発#16 DisplayAlertの使い方
- C#Xamarin.Formsでスマホ開発#17 DisplayActionSheetの使い方
- C#Xamarin.Formsでスマホ開発#18 Deviceごとの処理切り替え方法
- C#Xamarin.Formsでスマホ開発#19 LoadとCloseに代わるもの
- C#Xamarin.Formsでスマホ開発#20 戻るボタンを非表示にする
- C#Xamarin.Formsでスマホ開発#21 ViewCellの共通化のやり方
- C#Xamarin.Formsでスマホ開発##22 Switchの使い方を解説
- C#Xamarin.Formsでスマホ開発#23 コントロールをデータバインドする方法
- C#Xamarin.Formsでスマホ開発#24 Sliderの使い方を解説
- C#Xamarin.Formsでスマホ開発#25 Stepperの使い方を解説
- C#Xamarin.Formsでスマホ開発#26 Entryの使い方を解説
- C#Xamarin.Formsでスマホ開発#27 Editorの使い方を解説
- C#Xamarin.Formsでスマホ開発#28 Pickerの使い方を解説
- C#Xamarin.Formsでスマホ開発#29 Pickerでデータバインディングする方法
- C#Xamarin.Formsでスマホ開発#30 DatePickerとTimePickerの使い方
- C#Xamarin.Formsでスマホ開発#31 SearchBarの使い方を解説
- C#Xamarin.Formsでスマホ開発#32 ToolbarItemの使い方を解説
- C#Xamarin.Formsでスマホ開発#33 TableViewの使い方を解説
- C#Xamarin.Formsでスマホ開発#34 ActivityIndicatorの使い方を解説
- C#Xamarin.Formsでスマホ開発#35 ListViewを下に引っ張て更新する方法