• 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();
                    }
                }
            }
        }
  • 相关阅读:
    20192408胡益琳 实验五 信息搜集技术实践报告
    yishaadmin简单使用说明
    nvm升级之后,npm install报错unexpected token '.'
    unity 动画系统简单教程
    使用python删除word文档中的指定段落,顺便实现一下文档中的图片导出
    vue easyexcel 导出excel post请求接参数
    go mongo 根据时间删除
    go insert mongo find mongo
    CVPR2022 Oral | CosFace、ArcFace的大统一升级,AdaFace解决低质量图像人脸识
    three.js初探
  • 原文地址:https://www.cnblogs.com/bobodeboke/p/2960792.html
Copyright © 2020-2023  润新知