CODEWITHSUNDEEP
xamarinxamarin.formsxamarin.androidxamarin.ios
deanwin3390
deanwin3390

Reputation: 11

How to display content page half the screen size in Xamarin Forms?

I am working on a Xamarin Forms project and need to achieve the following: On Navigating from Home Page to a new Page, the new page will have a menu button, some text fields and a signature button. When we click on Menu Button, a menu page should slide down. The slide menu page should have a navigation bar and should be able to navigate to other sub menu options.

The slide menu page should overlap current content page. Is there any way to achieve it ?

Upvotes: 0

Views: 967

Answers (1)

bobrien
bobrien

Reputation: 68

Slide menu will just be determined by what packages you want to use or if you want to create animations with ResourceDictionary/VisualStateManager but to get it to be half the size of the page dynamically you can use something like:

XAML:

<Page x:Name="Page" HeightRequest="{Binding PageHeight, Mode=TwoWay}"></Page>
<Menu x:Name="Menu" HeightRequest="{Binding MenuHeight}"></Menu>

XAML.CS:

public class YourPage : YourType //(ContentViews for me)
private YourViewModel ViewModel => (YourViewModel)this.BindingContext;
public YourPage()
{
this.BindingContext = YourVM;
}

VM.CS:

public class YourViewModel : INotifyPropertyChanged
private double _pageHeight;
public double PageHeight
{
     set
     {
         if (_pageHeight != value)
         {
             _pageHeight = value;
             OnPropertyChanged("PageHeight");
             PageHeightChanged("PageHeight");
         }
     }
     get
     {
         return _pageHeight;
      }
}
private double _menuHeight;
public double MenuHeight
{
     set
     {
         if (_menuHeight != value)
         {
             _menuHeight = value;
             OnPropertyChanged("MenuHeight");
         }
     }
     get
     {
         return _menuHeight;
      }
}
private void PageHeightChanged()
{
    Menu.HeightRequest = Page.Height/2;
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
      PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

Upvotes: 0

Related Questions