Android 高仿三星日历

1.效果图：

Gif图片有利有弊啊，很想形象地展示效果，但是Gif图片不断地在动，不断循环也是会影响文章阅读。三星的日历做的非常好，点击右上角的点，下面会产生平移动画，非常酷，今天仿了一个。

2.Android 中的动画

这里使用了ObjectAnimator中的下面的方法

public static ObjectAnimatorofFloat(Object target, String propertyName, float... values)

target	要进行动画的控件
propertyName	要更改的属性名称，一般控件里SetXX后面的值，比如一个控件可以SetRotation,那么Rotation就是一个属性名称
values	属性更改的两个值，从开始到结束

具体代码：

// 旋转动画,从控件已经旋转的角度到180
    ObjectAnimator animRightRotation = ObjectAnimator.ofFloat(
        mTabFrameLayout, "rotation", mTabFrameLayout.getRotation(),
        180f).setDuration(1000);
    // 向左平移动画,从控件已经平移的位置到给定宽度
    ObjectAnimator animLeftMove = ObjectAnimator.ofFloat(mLinearLayout,
        "x", mLinearLayout.getX(), -54).setDuration(
        1000);

    animRightRotation.start();
    animLeftMove.start();      

重新点击圆圈的动画代码也是类似的非常简单。

3.谈下这次的布局

主要难点就是要用HorizontalScrollView这个控件，因为我们在超出屏幕范围内的地方存在布局，如上图所示。把HorizontalScrollView弄上一个空的Touch事件，这样手动就不会使它滑动。

下面是缩减版的布局代码。

<!-- 超出屏幕水平宽度的布局需要放在HorizontalScrollView中 -->
    <HorizontalScrollView
        android:id="@+id/scrollLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scrollbarSize="0dp"
        >
    <!-- 左边加右边的整体布局,会向左进行平移动画 -->
    <LinearLayout
        android:id="@+id/animationLayout" 
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        >
      <!-- 左边布局,默认会显示处理 -->
      <LinearLayout
          android:id="@+id/leftLayout" 
          android:layout_width="320dp"
          android:layout_height="match_parent"
          android:orientation="vertical">
         <ImageView 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ss_calendar_top"
            />
        <View 
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/ss_calendar"
            />
     </LinearLayout>
    
    
     <!-- 右边默认在屏幕视野外的部分 -->
     <LinearLayout
         android:layout_width="@dimen/right_container_width"
         android:layout_height="match_parent">
         <include 
             layout="@layout/right_container"
             />
     </LinearLayout>
     </LinearLayout>
     </HorizontalScrollView>      

4.再说下右边的文字旋转90度显示

网上有很多种方式实现，有用动画，有重新TextView的OnDraw方法，我这里只是简单地设置rotation等于90。宽度和高度设置成一样的，但由于布局宽度限制，看起来也只是一半。下面的代码只有两个TextView，多个添加即可，主要要把它们放在一个TabWidget中，这样设置某一个TextView为高亮状态比较容易。

<TabWidget xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rightTab"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:id="@+id/yearLabel"
        android:text="@string/year"
        android:layout_width="76dip"
        android:layout_height="76dip"
        android:rotation="90"
        android:paddingTop="5dp"
        android:gravity="center|bottom"
        />
      <TextView
        android:id="@+id/monthLabel"
        android:text="@string/month"
        android:layout_width="76dip"
        android:layout_height="76dip"
        android:rotation="90"
        android:paddingTop="5dp"
        android:gravity="center|bottom"
        />
  
</TabWidget>