2016-05-24 3 views
0

У меня есть приложение Xamarin Forms, и я хочу разместить стандартный (суб) заголовок на каждой странице. Подзаголовок будет содержать метку, которая будет изменяться для каждой страницы и необязательная кнопка «назад», и будет находиться чуть ниже заголовка приложения, которое содержит гамбургер меню и имя приложения.Подзаголовок приложения xamarin forms

Первоначально я создал «HeaderPage», который содержал макет стандартных элементов управления и все мои страницы, унаследованные от этой страницы. Я «спрятался» в ContentPage.Content поэтому страницы, которые унаследовали от HeaderPage может просто установить Content = установить HeaderPage Content

private ContentView _headerPageContent; 
    public new View Content 
    { 
     set { _headerPageContent.Content = value; } 
    } 

и страницу ребенок просто должен был установить текст:

 HeaderLabel = "Contact Us"; 

Это отлично работало до форм 2.1, где была удалена возможность маскировать ContentPage.Content.

В то время было рекомендовано использовать ContentPage с ControlTemplate с заголовком. Я исследовал этот путь, как и один из моих сотрудников, и мы оба отступили из-за сложности и дублирования кода, помещающего привязку на на каждую страницу.

Я думал о том, чтобы сделать заголовок просмотром или посмотреть, что потребуется, чтобы сделать его контролем.

На данный момент я выбрал простой путь и переименовал переменную «Содержимое» в «HeaderPageContent», поэтому все страницы, наследующие страницу заголовка, устанавливают HeaderPageContent вместо Content.

Кто-нибудь еще сделал что-то похожее на это? Что вы нашли?

ответ

0

Я столкнулся с такой же проблемой в своем приложении и нашел решение, подобное вам.

Создать PageBase класс, который наследуется от Xamarin.Forms.Page

- In that class create a `property` named `PageContent` typeof `View`.(Content will be there) 
- (optional)Override the default attribute for class: `[Xamarin.Forms.ContentProperty("PageContent")]` so you will not be have to annotate into xaml each time. 
- Override `OnParentSet` method like you want to style the page. 

Sample класса & Использование

// PageBase Класс

namespace Test.Views.Base 
{ 
    [Xamarin.Forms.ContentProperty("PageContent")] 
    public class PageBase: Xamarin.Foorms.Page 
    { 

     private Grid _mainLayout; 
     private Label _headerLabel; 
     private Label _footerLabel; 

     public View PageContent{get;set;} 

     public string HeaderText{get;set;} // you can make this property bindable 
     public string FooterText{get;set;} // you can make this property bindable 

     public PageBase():base() 
     { 
      _mainLayout = new Grid(); 
      _mainLayout.RowDefinitions.Add(new RowDefinition(){Height= new GridLenght(50, GridUnitType.Absolute)}); //Header 
      _mainLayout.RowDefinitions.Add(new RowDefinition(){Height= new GridLenght(1, GridUnitType.Star)}); //Content 
      _mainLayout.RowDefinitions.Add(new RowDefinition(){Height= new GridLenght(50, GridUnitType.Absolute)}); //Footer 

      _headerLabel = new Label(); 
      _footerLabel = new Label(); 

      _mainLayout.Children.Add(_headerLabel); 
      _mainLayout.Children.Add(_footerLabel); 

      Grid.SetRow(_footerLabel,2); 
     } 

     protected override void OnParentSet() 
     { 
      base.OnParentSet(); 

      if(PageContent != null) 
      { 
       _mainLayout.Children.Add(PageContent); 
       Grid.SetRow(PageContent,1); 
       this.Content= _mainLayout; 
      } 

      _headerLabel.Text = HeaderText; 
      _footerLabel.Text = FooterText; 
     } 
    } 
} 

Здесь Xaml

<?xml version="1.0" encoding="utf-8" ?> 
<local:PageBase xmlns="http://xamarin.com/schemas/2014/forms" 
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
       xmlns:local="clr-namespace:Test.Views.Base;assembly=Test" 
       xmlns:cell="clr-namespace:Test.Views;assembly=Test" 
       x:Class="Test.Views.TestPage" 
       HeaderText="Page Header" 
       FooterText="Page Footer" 
       > 

    <local:PageBase.PageContent> 
    <!-- Here Goes Page Content --> 
    </local:PageBase.PageContent> 
</local:PageBase>