web-dev-qa-db-ja.com

Xamarin.Formsで引き出し/スライダーメニューを作成するにはどうすればよいですか？

Xamarin.Formsを使用してスライダーメニューを作成するにはどうすればよいですか？それは焼き付けられているのでしょうか、それとも何かカスタムですか？

xamarinxamarin.forms
30
Jamey McElveen

マスター（つまりmen-）ページと詳細（つまりmain）ページの両方のすべての定義を含む新しいクラスを作成します。私は知っている、それは後ろから前に聞こえますが、例えば..

using System;
using Xamarin.Forms;

namespace testXamForms
 {
   public class HomePage : MasterDetailPage
   {
   public HomePage()
   {
     // Set up the Master, i.e. the Menu

     Label header = new Label
     {
       Text = "MENU",
       Font = Font.BoldSystemFontOfSize(20),
       HorizontalOptions = LayoutOptions.Center
     };
    // create an array of the Page names
     string[] myPageNames = {
       “Main”,
       “Page 2”,
       “Page 3”,
     };

     // Create ListView for the Master page.
     ListView listView = new ListView
     {
       ItemsSource = myPageNames,
     };

     // The Master page is actually the Menu page for us
    this.Master = new ContentPage
     {
       Title = "The Title is required.",
       Content = new StackLayout
       {
         Children = 
         {
           header, 
           listView
         },
       }
     };

     // Define a selected handler for the ListView contained in the Master (ie Menu) Page.

     listView.ItemSelected += (sender, args) =>
     {
       // Set the BindingContext of the detail page.
       this.Detail.BindingContext = args.SelectedItem;
        Console.WriteLine("The args.SelectedItem is
       {0}",args.SelectedItem);


     // This is where you would put your “go to one of the selected pages” 

       // Show the detail page.
       this.IsPresented = false;
     };
    // Set up the Detail, i.e the Home or Main page.
     Label myHomeHeader = new Label
     {
       Text = "Home Page",
       HorizontalOptions = LayoutOptions.Center
     };

     string[] homePageItems = { “Alpha”, “Beta”, “Gamma” };
     ListView myHomeView = new ListView {
       ItemsSource = homePageItems,
     };

     var myHomePage = new ContentPage();
     myHomePage.Content = new StackLayout
     {
       Children = 
       {
         myHomeHeader, 
         myHomeView
       } ,
     };
     this.Detail = myHomePage;
   }  
   }
 }
31
Phil Ryan

ビルトイン：MasterDetailPage。 DetailプロパティとMasterプロパティを任意の種類のページに設定します。 Hansleman.Forms は非常に啓発的であることがわかりました。

16
joe

私の最小の例（投稿された here ）は次のとおりです。

public class App
{
    static MasterDetailPage MDPage;

    public static Page GetMainPage()
    {
        return MDPage = new MasterDetailPage {
            Master = new ContentPage {
                Title = "Master",
                BackgroundColor = Color.Silver,
                Icon = Device.OS == TargetPlatform.iOS ? "menu.png" : null,
                Content = new StackLayout {
                    Padding = new Thickness(5, 50),
                    Children = { Link("A"), Link("B"), Link("C") }
                },
            },
            Detail = new NavigationPage(new ContentPage {
                Title = "A",
                Content = new Label { Text = "A" }
            }),
        };
    }

    static Button Link(string name)
    {
        var button = new Button {
            Text = name,
            BackgroundColor = Color.FromRgb(0.9, 0.9, 0.9)
        };
        button.Clicked += delegate {
            MDPage.Detail = new NavigationPage(new ContentPage {
                Title = name,
                Content = new Label { Text = name }
            });
            MDPage.IsPresented = false;
        };
        return button;
    }
}

サンプルソリューションは GitHubで でホストされています。

IOSでは、結果は次のようになります（左：メニューを開き、右：「B」をクリックした後）：

IOSプロジェクトのリソースとしてメニューアイコンを追加する必要があることに注意してください。

13
Falko

MasterDetailPage の簡単な例を探している場合は、 GitHub のサンプルリポジトリをご覧ください。非常に素晴らしい例も示されています here

5
Tomasz Kowalczyk

Slideoverkitは、Xamarin Formsで使用できる優れたプラグインです。無料のサンプルを見るために github があり、それに関するドキュメントを見つけることができます here 。

2
Nicolas Bodin-Ripert