Clever Geek Handbook

在Android中完善UI：StateListAnimator

哈Ha！预期课程将开始“ Android Developer。专业”我们为您准备了另一本有趣的材料的翻译。







我们将大部分的开发时间都花在了Android应用程序上，而不是在用户界面上工作-我们只是进入一个视图并开始编写代码。我注意到我们大多数人并不真正在乎用户界面。我认为这从根本上是错误的。移动应用程序开发人员也必须注意UI / UX。我并不是说“成为移动UI的专家”，但您必须了解设计语言和概念。



我之前写过一篇有关材料设计中的阴影的文章，并获得了很多好评。我要谢谢大家“掌握Android中的阴影”讨论了Android中的高程和阴影。在那里，我还展示了如何用它们补充我的开源UI库。 （缩放布局）。



在本文中，我想使用StateListAnimator改进我的库，并逐步向您展示如何做到这一点。



内容



本文涵盖以下主题：





可绘制状态



Android有17种不同的Drawable状态。







我们甚至可能从未见过其中一些人。我不会钻研每种状态。在大多数情况下，我们使用pressed，enabled，windows focused，checked等等。D.如果我们不声明绘制的状态，假定这种状态在默认情况下在Android中。



为了编写我们自己的StateListDrawable，我们需要了解这些状态。



StateListDrawable



它本质上是可绘制项目的列表，其中每个项目都有其自己的状态。要创建StateListDrawable，我们需要在folder中创建一个XML文件res/drawable。 



<item android:drawable="@drawable/i" android:state_pressed="true"/>


这是一个项目。它具有两个属性。可绘制和状态。 



<selector>
   <item
       android:drawable="@drawable/p"
       android:state_pressed="true"/>
   <item
       android:drawable="@drawable/default"/>
</selector>


这是StateListDrawable。如前所述，如果我们没有为元素声明状态，则意味着这是默认状态。



我可以使用ShapeDrawable吗？



是。除了使用android：drawable，还可以向元素添加任意形状。这是一个带有ShapeDrawable的元素。





StateListDrawable



您可以从API级别1使用StateListDrawable。因此，StateListDrawable没有API级别限制。 



<View
   android:layout_width="50dp"
   android:layout_height="50dp"
   android:foreground="@drawable/state_list_drawable"
   android:clickable="true"/>


就这样。现在我们的观点有了状态。当用户单击它时，其颜色将更改。当用户释放它时，它将具有默认状态和颜色。



但是请稍等。可点击的？我们为什么要添加此属性？我们还需要添加它吗？是。但仅适用于自定义视图。找出答案需要时间。按钮可以正常工作，而无需添加clickable，因为默认情况下它们是可单击的。但是，如果要将StateListDrawable用于View，ImageView，Custom View等，则需要添加clickable属性。




StateListDrawable



我在此提交中添加了StateListDrawable 。它类似于我上面给出的示例。当用户单击布局时，它是彩色的。但是，让我们使用StateListAnimator对此进行改进。



StateListAnimator



请记住，单击FloatingActionButton时，其Z值会由于动画而增加。可以这么说，这是一个StateListAnimator在屏幕外。一些材料设计小部件内部有自己的StateListAnimator。



让我们用关于StackOverflow的问题来解决这个问题。







（如何从棒棒糖按钮上删除边框/阴影）。



如果Material Design小部件内部有自己的StateListAnimator，则可以将其设置为null以删除这些功能（不推荐，它并非一无是处。）现在，答案听起来更加合乎逻辑。





（棒棒糖有一个讨厌的小功能stateListAnimator，它可以处理按钮的高度，产生阴影。



删除stateListAnimator以消除阴影。



如何执行此操作有几种选择：



在代码中：



button.setStateListAnimator（空）；）






那么我们如何创建它呢？



要了解StateListAnimator，我们需要了解property animation。我不会在本文中深入探讨属性动画。但至少我想向您展示基础知识。



动画属性



这是对象中属性的最简单示例。X是一个属性。 



class MyObject{
 
   private int x;
 
   public int getX() {
       return x;
   }
 
   public void setX(int x) {
       this.x = x;
   }
}


属性动画系统是一个强大的框架，可让您制作几乎所有内容的动画。对于任何物体属性随时间变化，无论您可以指定动画的它是否显示在屏幕上或不上。属性动画会在指定的时间段内更改属性（对象中的字段）的值。







X是一个属性。 T是时间。在动画期间，X属性在指定的时间更新。通常，这就是属性动画的工作方式。除了框，还可以有一个视图或任何对象。



ValueAnimator是动画属性的基类。您可以设置一个侦听器来更新ValueAnimator并监视属性更改。



ObjectAnimator是一个继承自的类ValueAnimator。如果以下更适合您，则可以使用ObjectAnimator：



  • 您有一个对象（具有某些属性的任何类）。
  • 您不想观看ValueAnimator侦听器。
  • 您要自动更新对象属性。


因此，如果我们有一个视图（它是一个对象），并且想要更新视图属性（x坐标，y坐标，旋转，平移或该视图具有getter / setter方法的任何其他属性），则可以使用ObjectAnimator。让我们继续创建StateListAnimator。 



<selector>
 
   <item android:state_pressed="true">
      <objectAnimator
           android:duration="200"
           android:propertyName="translationZ"
           android:valueTo="6dp"
           android:valueType="floatType" />
   </item>
 
   <item>
      <objectAnimator
           android:duration="200"
           android:propertyName="translationZ"
           android:valueTo="0dp"
           android:valueType="floatType"/>
   </item>
 
</selector>




按下并释放时，FAB按钮会对其“ translationZ”属性进行动画处理。



如前所述，我们可以直接使用object属性，而无需观察动画器中的更改。每个视图都有一个translationZ属性。这样，我们可以使用ObjectAnimator直接为translationZ设置动画。



我们还可以将多个<objectAnimator>s组合成<set>。让我们再更改一个属性视图。X标尺和Y标尺。



这就是结果！现在，当用户单击时，它也会增长。这是提交。







您还可以在中定义其他属性animator.xml。您可以在此处找到有关使用ObjectAnimator的更多信息。



就这样。我打算写更多有关ValueAnimator和ObjectAnimator的文章。这是用于动画处理对象的出色API。



编码成功！





More articles:


All Articles