2014-12-02 4 views
0

저는 Xamarin Forms에 완전히 익숙하지만 여러 페이지가있는 간단한 응용 프로그램을 만들었으며 페이지 간을 이동할 수 있습니다.Xamarin Forms 자동 이미지 SlideShow/Carousel

이미지, 버튼 및 기타 기본 컨트롤을 성공적으로 추가 했으므로 꽤 잘 보입니다.

제 문제는 페이지에 여러 이미지의 자동 회전식 캐 러셀을 만드는 방법을 알아낼 수 없다는 것입니다. 모든 Google 검색은 사용자가 화면을 스 와이프하여 페이지를 변경할 수있게하는 CarouselPage를 반환합니다.

3 개의 이미지가있는 수평 스크롤러를 고려하고 있지만 실제로는 동일한 효과가 없습니다. 사용자가 이미지를 통해 스스로 움직여야합니다!

누구든지이 작업을 수행 한 방법을 찾았습니까? 모든 힌트 또는 팁은 훌륭합니다!

당신은 내가 비슷한하지만 회전 목마 페이지 이동 버튼을 사용하여 수행 한 배경에 이미지를 교류 # 타이머, 회전 목마 페이지 및 contentPage의 조합을 코딩 할 수 있습니다

답변

2

:

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using Xamarin.Forms; 

namespace SEEForgeX.Views 
{ 
class CarouselView : CarouselPage 
{ 
    ContentPage image1,image2,image3,image4; 
    public CarouselView() 
    { 
     NavigationPage.SetHasNavigationBar(this, false); 

     string btnPrevTitle = "< Prev"; 
     string btnNextTitle = "Next >"; 
     Color btnColor = Color.FromRgba(0, 0, 0, 0.5); 
     Color btnTextColor = Color.White; 
     LayoutOptions btnPosY = LayoutOptions.EndAndExpand; 
     LayoutOptions btnPrevPosX = LayoutOptions.StartAndExpand; 
     LayoutOptions btnNextPosX = LayoutOptions.EndAndExpand; 
     Font buttonFont = Font.SystemFontOfSize(16, FontAttributes.Bold); 
     int btnWidth = 100; 
     string exitBtnImg = "close.png"; 

     Button nextBtn1 = new Button 
     { 
      Text = btnNextTitle, 
      BackgroundColor = btnColor, 
      TextColor = btnTextColor, 
      VerticalOptions = btnPosY, 
      HorizontalOptions = btnNextPosX, 
      Font = buttonFont, 
      WidthRequest = btnWidth 
     }; 

     Button prevBtn2 = new Button 
      { 
       Text = btnPrevTitle, 
       BackgroundColor = btnColor, 
       TextColor = btnTextColor, 
       VerticalOptions = btnPosY, 
       HorizontalOptions = btnPrevPosX, 
       Font = buttonFont, 
       WidthRequest = btnWidth 
      }; 

     image1 = new ContentPage 
     { 
      BackgroundImage = "slide_01.jpg", 
      Content = new StackLayout 
      { 
       HorizontalOptions = LayoutOptions.FillAndExpand, 
       VerticalOptions = LayoutOptions.FillAndExpand, 
       Orientation = StackOrientation.Vertical, 
       Padding = 0, 

       Children = { 
        new StackLayout 
        { 
         Orientation = StackOrientation.Horizontal, 
         VerticalOptions = LayoutOptions.StartAndExpand, 
         Padding = new Thickness(0,10,10,0), 
         Children = { exitBtn1 } 
        }, 
        new StackLayout 
        { 
         Orientation = StackOrientation.Horizontal, 
         VerticalOptions = LayoutOptions.EndAndExpand, 
         Padding = 20, 
         Children = { nextBtn1 } 
        } 
       } 
      }, 
     }; 

     image2 = new ContentPage 
     { 
      BackgroundImage = "slide_02.jpg", 
      Content = new StackLayout 
      { 
       HorizontalOptions = LayoutOptions.FillAndExpand, 
       VerticalOptions = LayoutOptions.FillAndExpand, 
       Orientation = StackOrientation.Vertical, 
       Padding = 0, 
       Children = { 
        new StackLayout 
        { 
         Orientation = StackOrientation.Horizontal, 
         VerticalOptions = LayoutOptions.StartAndExpand, 
         Padding = new Thickness(0,10,10,0), 
         Children = { exitBtn2 } 
        }, 
        new StackLayout 
        { 
         Orientation = StackOrientation.Horizontal, 
         VerticalOptions = LayoutOptions.EndAndExpand, 
         Padding = 20, 
         Children = {prevBtn2, nextBtn2} 
        } 
       } 
      }, 

     }; 
//This is the children of the parent view is like adding stacklayout.children.add(foo) but since    my parent class is a CarouselPage I can access Children its children 
      Children.Add(image1); 
      Children.Add(image2); 

    void prevBtn2_Clicked(object sender, EventArgs e) 
    { 
     this.CurrentPage = image1; 
    } 

    void nextBtn1_Clicked(object sender, EventArgs e) 
    { 
     this.CurrentPage = image2; 
    } 

    private async void exitBtn_Clicked(object sender, EventArgs e) 
    { 
     //await Navigation.PopModalAsync(); 
     await Navigation.PopModalAsync(); 
    } 

내가 구현하고 있지 않다을 타이머하지만 어렵지 않아야합니다. 어쩌면 루프를 사용할 수도 있습니다.

+0

안녕하세요 Mario, 답장을 보내 주셔서 감사합니다. 이게 내가 취할 경로 인 것 같아. 나는 길게 같은 선을 생각하고 있었다. 그러나 나는 어떤 종류의 회전 목마 통제에 지어주기를 바라고 있었다. .. 고마워. – Rick

+0

@Rick : 안녕 릭, 자동 슬라이드 쇼에 대한 해결책을 찾았습니까? 내 로그인 페이지의 bg에서 실행되는 자동 슬라이드 쇼가 필요합니다. 나는 Xamarin.Form Portable에서 C# timer를 사용할 수 없다. ( –

+0

@minamorsali 아마도 Device.StartTimer를 사용할 수 있을까? https://developer.xamarin.com/api/member/Xamarin.Forms.Device.StartTimer/p/System .TimeSpan/System.Func % 7BSystem.Boolean % 7D/ –