2017-04-14 4 views
0

MvxImageView(アンドロイドCardView内)でトリガ可能なアニメーションを実装して、カードのViewModelのプロパティの変更時にイメージに色(緑色または赤色)をオーバーレイしようとしています。 。 Stuart Lodgeの例hereを使用してカスタムクラスDynamicImageViewを作成しました。私がクリックしたときに、このプロパティは、カードへのクリックに変更し、MvvmCrossカスタムバインディングがRaisePropertyChangedによって通知されない

private string _animatingColor; 
    public string AnimatingColor { 
     get 
     { 
      return _animatingColor; 
     } 
     set 
     { 
      _animatingColor = value; 
      Debug.WriteLine("AnimatingColor set to " + value); 
      RaisePropertyChanged(() => AnimatingColor); 
     } 
    } 

:標準MvvmCross表記以下、私も定義された整合性を持って、この制御のためのViewModel内

public class DynamicImageView : MvxImageView 
{ 
    public DynamicImageView(Context context) : base(context) 
    { 
    } 

    public DynamicImageView(Context context, IAttributeSet attrs) : base(context, attrs) 
    { 
    } 

    public DynamicImageView(Context context, IAttributeSet attrs, int defStyleAttr) : base(context, attrs, defStyleAttr) 
    { 
    } 

    protected DynamicImageView(IntPtr javaReference, JniHandleOwnership transfer) : base(javaReference, transfer) 
    { 
    } 

    protected override void OnMeasure(int widthMeasureSpec, int heightMeasureSpec) 
    { 
     Drawable d = this.Drawable; 

     if (d != null) 
     { 
      // ceil not round - avoid thin vertical gaps along the left/right edges 
      int width = MeasureSpec.GetSize(widthMeasureSpec); 
      int height = (int)Math.Ceiling(width * (float)d.IntrinsicHeight/d.IntrinsicWidth); 
      this.SetMeasuredDimension(width, height); 
     } 
     else 
     { 
      base.OnMeasure(widthMeasureSpec, heightMeasureSpec); 
     } 
    } 

    private ObjectAnimator colorFilterAnimation; 

    private string _animatingColor; 
    public string AnimatingColor 
    { 
     set 
     { 
      System.Diagnostics.Debug.WriteLine("Animation triggered"); 
      if (value != _animatingColor) 
      { 
       _animatingColor = value; 
       colorFilterAnimation = ObjectAnimator.OfObject((ImageView)this, "colorFilter", new ArgbEvaluator(), 0, 0); 
       switch (value) 
       { 
        case "red": 
         colorFilterAnimation.SetObjectValues(0, new Color(100, 0, 0, 80).ToArgb()); 
         System.Diagnostics.Debug.WriteLine("Starting Red Animation"); 
         break; 
        case "green": 
         colorFilterAnimation.SetObjectValues(0, (int)Color.Green); 
         System.Diagnostics.Debug.WriteLine("Starting Green Animation"); 
         break; 
       } 
       colorFilterAnimation.SetDuration(1000); 
       colorFilterAnimation.Start(); 
      } 
     } 
    } 
} 

、私はプロパティ setの中からデバッグプリントを見ることができますが、コントロール内でAnimatingColorのために setをトリガしているようには見えません。コントロールは通常通りAXMLで参照されています。

<DynamicImageView 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:scaleType="centerCrop" 
    local:MvxBind="ImageUrl 'http:'+Profile.Headshot.Url; AnimatingColor .AnimatingColor" /> 

、それは価値がある何のため、IMAGEURLは正しく結合しない、と期待通りのアップデートは、URLはViewModelにに変更されたとき。さらに、Debug.PrintLine("Animation triggered")は、カードが作成されたときには印刷されますが、ViewModelでプロパティが変更されたときは決して印刷されません。

+0

'AnimatingColor'のカスタムバインディングを作成しましたか?もしそうなら、それを投稿できますか? –

+0

あなたは、あなたがそれを言うときにあなたが何を意味するのか分からないので - 私の問題がどこにあるのかと期待しています。しかし、n + 1日のサンプルに基づいて、単にAnimatingColorの文字列を使用しているので、追加されたプロパティに文字列をバインドするために何も必要がないことはわかりませんでした。編集:もちろん、私はこのバインディングの仕組みが間違っている可能性が非常に高いです。できるだけ多くの情報を提供したかっただけです。 –

+0

'local:MvxBind'でバインドするプロパティは、[カスタムバインディング](http://slodge.blogspot.com/2013/06/n28-custom-bindings-n1-days-of-mvvmcross.html)を持つ必要があります。彼らが何かをするために書かれた。使用しているImageUrlバインディングが期待どおりに機能する理由は、MvvmCross自体のどこかにターゲットバインディングが書き込まれているためです。デバッグ出力ウィンドウを確認したら、MvvmCrossが 'AnimatingColor'のコントロールをバインドできないというメッセージが表示されますか? –

答えて

0

あなたのDynamicImageViewコントロールのカスタムバインディングを作成する必要があると思います。このような何かがそれを実行する必要があります。そして、あなたはMvvmCrossがそれを使用できるように、それを登録する必要があり、セットアップクラスで

public class DynamicImageViewAnimatingColorBinding : MvxTargetBinding 
{ 
    public DynamicImageViewAnimatingColorBinding(DynamicImageView target) : base(target) 
    { 
    } 

    protected DynamicImageView View => Target as DynamicImageView; 

    public override MvxBindingMode DefaultMode => MvxBindingMode.OneWay; 

    public override Type TargetType => typeof(string); 

    public override void SetValue(object value) 
    { 
     var view = View; 
     if (view == null) 
      return; 

     view.AnimatingColor = (string) value; 
    } 
} 

protected override void FillTargetFactories(IMvxTargetBindingFactoryRegistry registry) 
    { 
     registry.RegisterCustomBindingFactory<DynamicImageView>(
      nameof(DynamicImageView.AnimatingColor), 
      image => new DynamicImageViewAnimatingColorBinding (image)); 

     base.FillTargetFactories(registry); 
    } 

私はこのコードをテストしていない、それはいくつかに基づいていますiOSで使用したのと非常によく似たコードですが、Androidでは正常に動作するはずです。うまくいけば、これは役に立ちます。

+0

変更は実装されていますが、アイテムが押されてもバインディングエラーはありませんが、アニメーションは表示されません。 VMのプロパティは変化しています。私は何か起こるのを見て回り続けます。 –

+0

少し基本的かもしれませんが、ページのBindingContextは間違いなく設定されていますか? –

+1

ねえ、ちょうどここで顔をして、あなたの時間を無駄にして謝罪します。私は、CardViewがListViewのテンプレートとして使用されているという事実を、私は言及していませんでした。問題は、私がOvservableCollectionを使用していなかったことです。そのため、Property Changesは恐らくパーコレーションしていませんでした。私は今働いている。あなたのすべての協力に感謝します;あなたの明確な質問は、より生産的な方法で私のコードを検査して根本的な問題を見つけるのを助けました。乾杯! –

0

James Mundyさんの質問は、根本的な問題は私がリスト内でObservableCollectionを使用していなかったことに気付きました。そのため、基になるViewModelsへの変更はUIに反映されませんでした。

関連する問題