버튼을 누를 때 오른쪽에서 슬라이드하는 마스터 세부 정보 페이지에 알림을 추가하는 방법

Question

헤더의 버튼을 누르면 오른쪽에서 슬라이드 할 알림 내용을 추가해야합니다. 헤더는 내부 버튼이있는 상자보기입니다.

이 내가 달성하기 위해 노력하고 무엇 :

이 내가 지금 무엇을 가지고 (버튼이 아무것도하지 않는다) :

Answer 1

나는 자 마린을 생각하지 않습니다. 양식은 두 개의 마스터 페이지 (서랍)를 지원하지만 페이지의 내용을 TranslationX으로 설정하여 화면의 Width으로 설정 한 다음 ToolbarItem을 추가하십시오 즉, 눌렀을 때 뷰의 X이 0으로 변환되고 다시 누르면 뷰가 화면의 너비로 다시 변환됩니다. 유일한 단점은이보기가 AppBar 아래에 있다는 것입니다 (사진과 달리 알림 패널이 AppBar 및 StatusBar 앞에 있음).

알림 패널 부분 :

// I think 260 is a good width (but I didn't test), experiment and see 
var notificationsPanel = new StackLayout { WidthRequest = 260 }; 

// Needed because we don't know the Width yet 
SizeChanged += (sender, e) => 
{ 
    if(Width > 0) 
     notificationsPanel.TranslationX = Width; 
} 

Width 속성 페이지의 폭입니다

코드는 다음과 같은 것이다.

---

ToolbarItem 부분 :

if(notificationsPanel.TranslationX > 0) 
    notificationsPanel.TranslateTo(Width - notificationsPanel.Width); 
else 
    notificationsPanel.TranslateTo(Width); // Here the Width will already be set 

---

페이지의 내용 :

Content = new Grid 
{ 
    Children = 
    { 
     actualContent, 
     notificationsPanel 
    } 
} 

는 희망이 도움이!

---

편집

더 쉬운 아이디어는 알림 패널을 사용하지 않고 페이지 를 작성하고이 라이브러리를 사용하는 것입니다 : 팝업으로 대신 페이지 안에보기로 NotificationsPanel을 추가 Rg.Plugins.Popup을 .

이 라이브러리의 위키 페이지는 Wiki입니다. 팝업에 대한 XAML 페이지를 만들고 "루트"페이지에 ToolbarItem을 추가하여 클릭하면 팝업이 표시되는지 확인하는 간단한 메서드를 호출합니다 (그렇지 않은 경우 추가, 추가 할 경우 제거). 토글 형 메소드). 이런 식으로 뭔가 :

if (PopupNavigation.PopupStack.Count > 0) 
    PopupNavigation.PopAsync(); 
else 
    PopupNavigation.PushAsync(new NotificationsPanel()); 

당신이 ToolbarItem를 추가하는 방법을 모르는 경우는,이 ​​같은 뭔가 :

ToolbarItems.Add(new ToolbarItem 
{ 
    Text = "Notifications", 
    Icon = "notifications-icon.png" // change this based on your image requirements, Xamarin.Forms has more than one way to store images 
    Command = new Command(() => 
    { 
     if (PopupNavigation.PopupStack.Count > 0) 
      PopupNavigation.PopAsync(); 
     else 
      PopupNavigation.PushAsync(new NotificationsPanel()); 
    }) 
}); 

당신이 Xamarin.Forms와 이미지에 대한 자세한 내용을 알고 싶다면 : Working with Images

그게 전부입니다.NotificationsPanel을 화면의 오른쪽에서 가져 오도록 애니메이션을 추가하고 NotificationsPanel PopupPage에서보기를 오른쪽으로 정렬하고 WidthRequest를 화면의 너비보다 작게 지정해야합니다.

희망이 있습니다.