• Android 类似时间轴的实现


    想要实现图片中的的时间轴的效果,设定了三种颜色,但是出来的只有一个黑色,还不是设定好的,而且长度很长的话不能滚动,下面上代码:

    布局文件:

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
    
        <LinearLayout
            android:id="@+id/trjectory_today_rl1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
        </LinearLayout>
    </LinearLayout>

    类文件,时间段是从服务器获取的,多少和大小都是不确定的
    主要代码:

    private Handler mHandler = new Handler() {
                    @Override
                    public void handleMessage(Message msg) {
                            switch (msg.what) {
                            case 0:
                                    if (trajectory2 != null) {
                                            if (trajectory2.getResponseCode().equals("200")) {
                                                    progressDialog.dismiss();
                                                    if (trajectory2.getSegmentNum() != 0) {
                                                            thefirsttime = trajectory2.getList().get(0)
                                                                            .get("BeginTime");// 第一个时间段的开始时间,用作参照物
                                                            Y=new int[trajectory2.getSegmentNum()];
                                                            X=new int[trajectory2.getSegmentNum()];
                                                            high=new int[trajectory2.getSegmentNum()];
                                                            color=new int[trajectory2.getSegmentNum()];
    
                                                            for (int i = 0; i < trajectory2.getList().size(); i++) {
                                                                    name = trajectory2.getList().get(i).get("Name");
                                                                    begintime = trajectory2.getList().get(i)
                                                                                    .get("BeginTime");
                                                                    int begin = TimeToInt(begintime);//将阶段开始时间换算为分钟,计算坐标
                                                                    endtime = trajectory2.getList().get(i)
                                                                                    .get("EndTime");
                                                                    int end = TimeToInt(endtime);
                                                                    high = end - begin;// 矩形的高度
                                                                    Y = begin - TimeToInt(thefirsttime);// 获得矩形的开始的Y轴坐标,最初是0
                                                                   
                                                                    if (name.equals("觉醒")) {
                                                                            color = R.color.red;
                                                                            X = width / 2;// 矩形的轴心的坐标
                                                                    } else if (name.equals("浅睡")) {
                                                                            color = R.color.lightblue;
                                                                            X = width / 2;
    
    //                                                                        r1.addView(rectview);
                                                                    } else if (name.equals("深度睡眠")) {
                                                                            color = R.color.green;
                                                                            X = width / 2 + 20;
                                                                    } else {
                                                                            color = R.color.lightgray;
                                                                            X = width / 2;
                                                                    }
                                                            }
                                                            rectview=new RectView(getActivity(),X,Y,high,color);
                                                            r1.addView(rectview);
                                                           
                                                    } else {
                                                            progressDialog.dismiss();
                                                            showDialog("提示", "今天没有睡眠信息...");
                                                    }
    
                                            } else {
                                                    progressDialog.dismiss();
                                                    showDialog("提示", trajectory2.getResponseDesc());
                                            }
    
                                    } else {
                                            progressDialog.dismiss();
                                            showDialog("提示", "获取数据失败...");
                                    }
                                    break;
                            }
                    }  
         
     };

    下面上画图的类:

    热搜: 二维码 定时器 手电筒 滑块 斗地主 书架 定位 买手机 聊天 游戏开发 游戏 股票查询 机顶盒 通话记录 二维码扫描 振动器 listview fragment 音乐播放器 播放器
    eoe 移动开发者论坛»社区 › Android开发交流 › Android开发问答 › 类似时间轴的实现
    12 / 2 页下一页
    返回列表 发新帖回复
    查看: 988|回复: 17
        
    打印 上一主题 下一主题
    收起左侧
    [Android界面] 类似时间轴的实现
    [复制链接]
        
    yalongy58
    
    4
    主题    
    
    113
    帖子    
    
    511
    e币
    
        发消息
    
        
    电梯直达 跳转到指定楼层
    楼主
    发表于 2013-12-29 21:37:33 | 只看该作者 |只看大图 回帖奖励
    0基础的你+1张学习路径图+3个月粮饷+9阶段系统学习=Android开发大拿
    10e币
    想要实现图片中的的世间轴的效果,设定了三种颜色,但是出来的只有一个黑色,还不是设定好的,而且长度很长的话不能滚动,下面上代码:布局文件:
    [mw_shl_code=java,true]<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
    
        <LinearLayout
            android:id="@+id/trjectory_today_rl1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">
        </LinearLayout>
    </LinearLayout>[/mw_shl_code]
    
    类文件,时间段是从服务器获取的,多少和大小都是不确定的
    主要代码:
    [mw_shl_code=java,true]private Handler mHandler = new Handler() {
                    @Override
                    public void handleMessage(Message msg) {
                            switch (msg.what) {
                            case 0:
                                    if (trajectory2 != null) {
                                            if (trajectory2.getResponseCode().equals("200")) {
                                                    progressDialog.dismiss();
                                                    if (trajectory2.getSegmentNum() != 0) {
                                                            thefirsttime = trajectory2.getList().get(0)
                                                                            .get("BeginTime");// 第一个时间段的开始时间,用作参照物
                                                            Y=new int[trajectory2.getSegmentNum()];
                                                            X=new int[trajectory2.getSegmentNum()];
                                                            high=new int[trajectory2.getSegmentNum()];
                                                            color=new int[trajectory2.getSegmentNum()];
    
                                                            for (int i = 0; i < trajectory2.getList().size(); i++) {
                                                                    name = trajectory2.getList().get(i).get("Name");
                                                                    begintime = trajectory2.getList().get(i)
                                                                                    .get("BeginTime");
                                                                    int begin = TimeToInt(begintime);//将阶段开始时间换算为分钟,计算坐标
                                                                    endtime = trajectory2.getList().get(i)
                                                                                    .get("EndTime");
                                                                    int end = TimeToInt(endtime);
                                                                    high = end - begin;// 矩形的高度
                                                                    Y = begin - TimeToInt(thefirsttime);// 获得矩形的开始的Y轴坐标,最初是0
                                                                   
                                                                    if (name.equals("觉醒")) {
                                                                            color = R.color.red;
                                                                            X = width / 2;// 矩形的轴心的坐标
                                                                    } else if (name.equals("浅睡")) {
                                                                            color = R.color.lightblue;
                                                                            X = width / 2;
    
    //                                                                        r1.addView(rectview);
                                                                    } else if (name.equals("深度睡眠")) {
                                                                            color = R.color.green;
                                                                            X = width / 2 + 20;
                                                                    } else {
                                                                            color = R.color.lightgray;
                                                                            X = width / 2;
                                                                    }
                                                            }
                                                            rectview=new RectView(getActivity(),X,Y,high,color);
                                                            r1.addView(rectview);
                                                           
                                                    } else {
                                                            progressDialog.dismiss();
                                                            showDialog("提示", "今天没有睡眠信息...");
                                                    }
    
                                            } else {
                                                    progressDialog.dismiss();
                                                    showDialog("提示", trajectory2.getResponseDesc());
                                            }
    
                                    } else {
                                            progressDialog.dismiss();
                                            showDialog("提示", "获取数据失败...");
                                    }
                                    break;
                            }
                    }
    
            };
    [/mw_shl_code]
    
    下面上画图的类:
    [mw_shl_code=java,true]package com.ban.chart;
    
    import android.content.Context;
    import android.graphics.Canvas;
    import android.graphics.Color;
    import android.graphics.Paint;
    import android.util.AttributeSet;
    import android.view.View;
    
    public class RectView extends View {
            private int[] width;//矩形的轴心的坐标
            private int[] height;//矩形的高度
            private int[] top;//矩形的顶部坐标
            private int[] bottom;//矩形底部坐标
           
            private Chart chart;
            private Paint paint;
            private int[] color;
           
            public RectView(Context context, AttributeSet attrs) {
                    super(context, attrs);
                    // TODO Auto-generated constructor stub
            }
    
            public RectView(Context context) {
                    super(context);
                    // TODO Auto-generated constructor stub
            }
           
            public RectView(Context context, int[] X,int[] Y,int[] high,int[] color) {
                    super(context);
                    this.width=X;//矩形轴心坐标
                    this.height=high;//矩形高度
                    this.top=Y;//矩形顶部坐标
                    this.color=color;
                    bottom=new int[height.length];
    //                bottom=top+height;//矩形底部坐标
                    paint = new Paint();
                    paint.setAntiAlias(true);
            }
            // 画柱状图
                    public void drawChart(Canvas canvas){
                            for(int i=0;i<height.length;i++){
                                    bottom=(top+50)+height*10;
                                    paint.setColor(color);
                                    canvas.drawRect(width-5, top+50, width+5, bottom, paint) ;
                                   
                            }
                           
                                   
                           
                           
    //                        canvas.drawRect(width-5, top, width+5, bottom, paint) ;
                    }
                    @Override
                    public void onDraw(Canvas canvas){
                            canvas.drawColor(Color.WHITE);
                            drawChart(canvas);
                            invalidate();
                    }
    }

    图片:

    时间轴 480副本.png

  • 相关阅读:
    【转】灰色在PPT中的运用
    [转]多多“亦”善:把大量内容放到一页PPT的5个技巧
    android应用程序的安装方式与原理
    oracle 数据库 date + 1 转载
    运行ant脚本(转载)
    Oracle修改字段类型方法总结(转)
    转载 jQueryEasyUI Messager基本使用
    oracle dmp数据导入
    oracle 查看表的索引信息
    sqlplus 分析执行计划
  • 原文地址:https://www.cnblogs.com/zhujiabin/p/4249466.html
Copyright © 2020-2023  润新知