xamarin.forms - Sliding information box in bottom

2019-08-25 02:30发布

问题:

I am learning xamarin.forms technology.What mean by title is that I want to make sliding information box (from bottom, left or right side of the screen). Everything should be in the bottom of the page/view. Also placing in bottom something in xamarin.forms is also petty tricky.

I want to do this instead of dialog, because I dont want to feeze ui when alert dialog pop and i dont want force an user to click anything

Could you guys show me how can I do that?

回答1:

You should use AbsoluteLayout for this, there goes an example:

// ContentPage:

var layout = new StackLayout {
 // you page content
};

Content = new NotifyLayoutView(layout);

And view class:

public class NotifyLayoutView : AbsoluteLayout
{
   public NotifyLayoutView(View content)
   {
        var flash = new StackLayout
        {
            BackgroundColor = Color.Red,
            HorizontalOptions = LayoutOptions.FillAndExpand,
            Children = {
               new Label { Text = "My notification" }
            }
        };

        SetLayoutFlags(content, AbsoluteLayoutFlags.All);
        SetLayoutBounds(content, new Rectangle(0f, 0f, 1f, 1f));
        SetLayoutFlags(flash, AbsoluteLayoutFlags.WidthProportional | 
        AbsoluteLayoutFlags.PositionProportional);
        SetLayoutBounds(flash, new Rectangle(0.5, 0.99, 0.95, AutoSize));
        Children.Add(content);
        Children.Add(flash);
   }
}

To change flash visibility you can use:

// open
await flash.ScaleTo(1.0f, 100);
await flash.FadeTo(1.0f, 100);

// hide
await layout.ScaleTo(0.0f);
await layout.FadeTo(0.0f);


回答2:

Or try to use SlideOverKit (nuget package: https://www.nuget.org/packages/SlideOverKit/)