2017-07-18 11 views
0

CarouselView内にViewFlipper(https://github.com/TorbenK/ViewFlipper)を表示するXamarin.Formsアプリケーションがあります。CarouselView内のオブジェクトへのアクセス方法Xamarin.Forms

カルーセル内のページを変更するときにViewFlipperを前面に戻したいと思います。しかし、私はViewFlipperにアクセスする方法を把握していないようです。

私は、次の作業のコードがあります:私はCarouselContentにViewFlipperを追加しようとしたが、私は仕事にそれを得ることができませんでした

public class CarouselContent 
{ 
    public string FrontImg { get; set; } 
    public string BackImg { get; set; } 
} 

public class MainPage : ContentPage 
{ 
    public MainPage() 
    { 
     var pages = new ObservableCollection<CarouselContent>(); 

     var page1 = new CarouselContent(); 
     page1.FrontImg = "page1Front"; 
     page1.BackImg = "page1Back"; 

     var page2 = new CarouselContent(); 
     page2.FrontImg = "page2Front"; 
     page2.BackImg = "page2Back"; 

     pages.Add(page1); 
     pages.Add(page2); 

     var carouselView = new Carousel(pages); 

     Content = carouselView; 
    } 
} 

public class Carousel : AbsoluteLayout 
{ 
    private DotButtonsLayout dotLayout; 
    private CarouselView carousel; 

    public Carousel(ObservableCollection<CarouselContent> pages) 
    { 
     carousel = new CarouselView(); 

     var template = new DataTemplate(() => 
     { 
      //create page 
      var absLayout = new AbsoluteLayout(); 

      //create images for the flipper 
      var frontImg = new Image 
      { 
       Aspect = Aspect.AspectFit 
      }; 
      frontImg.SetBinding(Image.SourceProperty, "FrontImg"); 

      var backImg = new Image 
      { 
       Aspect = Aspect.AspectFit 
      }; 
      backImg.SetBinding(Image.SourceProperty, "BackImg"); 

      //create flipper 
      var flipper = new ViewFlipper.FormsPlugin.Abstractions.ViewFlipper(); 
      flipper.FrontView = frontImg; 
      flipper.BackView = backImg;    

      //Add flipper to page 
      absLayout.Children.Add(flipper); 

      return absLayout; 
     }); 

     carousel.ItemsSource = pages; 
     carousel.ItemTemplate = template; 

     Children.Add(carousel); 
    } 
} 

を。何か案は?

EDIT:

私がCarouselViewのDataTemplateのにCarouselContentで作成されたアイテムをバインド可能な項目とAbsoluteLayoutを作成し、バインドしようとしたが、ライン「(B BindableAbsLayoutなど).Children.Add((ビュー)V ); ' BindableAbsLayoutでは決して呼び出されません。私は間違って何をしていますか?

class BindableAbsLayout : AbsoluteLayout 
{ 
    public static readonly BindableProperty ItemsProperty = 
     BindableProperty.Create(nameof(Items), typeof(ObservableCollection<View>), typeof(BindableAbsLayout), null, 
      propertyChanged: (b, o, n) => 
      { 
       (n as ObservableCollection<View>).CollectionChanged += (coll, arg) => 
       { 
        switch (arg.Action) 
        { 
         case NotifyCollectionChangedAction.Add: 
          foreach (var v in arg.NewItems) 
           (b as BindableAbsLayout).Children.Add((View)v); 
          break; 
         case NotifyCollectionChangedAction.Remove: 
          foreach (var v in arg.NewItems) 
           (b as BindableAbsLayout).Children.Remove((View)v); 
          break; 
        } 
       }; 
      }); 

    public ObservableCollection<View> Items 
    { 
     get { return (ObservableCollection<View>)GetValue(ItemsProperty); } 
     set { SetValue(ItemsProperty, value); } 
    } 
} 


public class CarouselContent 
{ 
    private ViewFlipper.FormsPlugin.Abstractions.ViewFlipper _flipper; 
    private ObservableCollection<View> _items; 

    public ObservableCollection<View> Items 
    { 
     get { return _items; } 
    } 

    public CarouselContent(string frontImgStr, string backImgStr) 
    { 
     _items = new ObservableCollection<View>(); 

     _flipper = new ViewFlipper.FormsPlugin.Abstractions.ViewFlipper(); 

     var frontImg = new Image 
     { 
      Aspect = Aspect.AspectFit 
     }; 
     frontImg.Source = frontImgStr; 

     var backImg = new Image 
     { 
      Aspect = Aspect.AspectFit 
     }; 
     backImg.Source = backImgStr; 

     _flipper.FrontView = frontImg; 
     _flipper.BackView = backImg; 

     AbsoluteLayout.SetLayoutBounds(_flipper, new Rectangle(0.5, 0.05, 0.85, 0.85)); 
     AbsoluteLayout.SetLayoutFlags(_flipper, AbsoluteLayoutFlags.All); 

     Items.Add(_flipper); 
    } 
} 


public class Carousel : AbsoluteLayout 
{ 
    private DotButtonsLayout dotLayout; 
    private CarouselView carousel; 

    public Carousel(ObservableCollection<CarouselContent> pages) 
    { 
     carousel = new CarouselView(); 

      var template = new DataTemplate(() => 
      { 
       var absLayout = new BindableAbsLayout(); 
       absLayout.BackgroundColor = Color.FromHex("#68BDE4"); 
       absLayout.SetBinding(BindableAbsLayout.ItemsProperty,"Items"); 
       return absLayout; 
      }); 

     carousel.ItemsSource = pages; 
     carousel.ItemTemplate = template; 

     Children.Add(carousel); 
    } 
} 
+0

なぜビューフリッパーの状態を制御するためのデータバインディングを使用できますか? –

答えて

0

ないベストプラクティスはここですが、あなたは(あなたがcarouselviewに前後に変更するたびに発射)ItemSelectedイベント経由でアクセスして試みることができるかわから

ワイヤーそれがアップ

carousel.ItemSelected += carouselOnItemSelected; 

あなたViewFlipperゲット

private void carouselOnItemSelected(object sender, SelectedItemChangedEventArgs selectedItemChangedEventArgs) 
     { 
      CarouselContent carouselContent = selectedItemChangedEventArgs.SelectedItem; 
      ViewFlipper viewFlipper = carouselContent.Children[0]; 
      viewFlipper.FlipState = ViewFlipper.FrontView; 
     } 
+0

carouselContentに 'Children'の定義が含まれていません – wkeuning

関連する問題