Android 高仿三星日历

1.效果图：

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

2.Android 中的动画

// 旋转动画,从控件已经旋转的角度到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>

项目下载地址：
SSCalendar.rar
文章源地址：

http://www.waitingfy.com/?p=646

Android 软件开发 | RSS 2.0 | Respond | Trackback |