android中实现指针滑动的动态效果

本次实现的是类似于墨迹天气中轨迹图片上指针随着数值滚动滑动的效果，基本思路是开启线程，控制指针所在的imageview控件的padding属性。

  <FrameLayout            android:layout_width="fill_parent"            android:layout_height="wrap_content"            android:background="#fff"            android:paddingBottom="5dp"            android:paddingLeft="5dp"            android:paddingRight="2dp"            >            <ImageView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_gravity="right"                android:src="@drawable/up_icon"                android:layout_marginTop="0dp"                android:paddingTop="0dp" />            <LinearLayout                android:layout_width="240dip"                android:layout_height="wrap_content"                android:layout_marginLeft="5dp"                android:layout_marginRight="7dp"                android:orientation="horizontal" >                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="left"                    android:text="优"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="left"                    android:text="良"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="left"                    android:text="中等"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="left"                    android:text="不健康"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="left"                    android:text="有毒害"                    android:textSize="12sp" />            </LinearLayout>                                    <LinearLayout                android:layout_width="240dip"                android:layout_height="wrap_content"                android:layout_marginLeft="5dp"                android:layout_marginRight="7dp"                android:layout_marginTop="40dp"                android:orientation="horizontal" >                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="80"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="120"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="160"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="200"                    android:textSize="12sp" />                <TextView                    android:layout_width="0dp"                    android:layout_height="wrap_content"                    android:layout_weight="1"                    android:gravity="center_horizontal"                    android:text="400"                    android:textSize="12sp" />            </LinearLayout>            <ImageView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="10dp"                android:layout_marginTop="10dp"                android:src="@drawable/zhizhen"                android:id="@+id/zhizhen"/>            <ImageView                android:id="@+id/dengji_img"                android:layout_width="250dip"                android:layout_height="wrap_content"                android:layout_marginTop="25dp"                android:src="@drawable/dengji_icon" />        </FrameLayout>

上面这段代码实现的布局为

首先，因为指针有压着下面的滚动条，因此这是一个framelayout的布局。其次，要实现指针的匀速滚动，需要开启一个线程，在线程中能够实现利用循环，以及线程的休眠，通过控制指针所在图标的padding属性来实现滚动的动画效果

    Handler myHandler =new Handler(){        @Override        public void handleMessage(Message msg) {            // TODO Auto-generated method stub            super.handleMessage(msg);            //对于c的更改和循环应该是在线程中跑，要不run仅仅执行一次，                        zhizhen.setPadding(c, 0, 0, 0);        }                     };    class MyThread extends Thread{        @Override        public void run() {            //发送一个消息，通知主线程改变UI         try {                         while(c<=input){                 c=c+1;                 this.sleep(10);                 myHandler.sendEmptyMessage(0);                              }                                     } catch (InterruptedException e) {            // TODO Auto-generated catch block            e.printStackTrace();        }

为了控制指针滑动的距离和对应的数值相对应，可以采用以下方法，通过比例来进行控制：

    class myTh extends Thread {        @Override        public void run() {            super.run();            length_margin = dengji_width - zhizhen_width;            if (aqi < 200) {                Float aqi_proportion = (float) aqi / 300;                margin_length = (float) aqi_proportion * length_margin;            }            if (aqi >= 200 && aqi < 300) {                Float aqi_proportion = (float) 200 / 300;                Float margin = (float) aqi_proportion * length_margin;                margin_length = margin + (float) (aqi - 200) / 2 / 300                        * length_margin;            }            if (aqi >= 300) {                Float aqi_proportion = (float) 270 / 300;                margin_length = (float) aqi_proportion * length_margin;            }            // if(i/300>1 && i%300>0){            // }            c = 0;            while (c <= margin_length) {                c = c + 1;                try {                    Thread.sleep(2);                    handler.sendEmptyMessage(0);                } catch (InterruptedException e) {                    e.printStackTrace();                }            }        }    }

更多相关文章

随机推荐