android自定义折线图可左右滑动,Android自定义View实现折线图效果

下面就是结果图(每种状态用一个表情图片表示)：

一、主页面的布局文件如下：

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity"

xmlns:app="http://schemas.android.com/apk/res/ting.example.linecharview">

android:id="@+id/test"

android:layout_width="match_parent"

android:layout_height="match_parent"

app:xytextcolor="@color/bg"

app:xytextsize="20sp"

app:interval="80dp"

/>

其中linecharview就是自定义的View，而app:xx就是这个View的各种属性。

二、在values的attrs文件中加入如下xml，来定义linecharview的各种属性：

三、接下来建个类LineCharView继承View，并申明如下变量：

private int xori;//圆点x坐标

private int yori;//圆点y坐标

private int xinit;//第一个点x坐标

private int minXinit;//在移动时，第一个点允许最小的x坐标

private int maxXinit;//在移动时，第一个点允许允许最大的x坐标

private int xylinecolor;//xy坐标轴颜色

private int xylinewidth;//xy坐标轴大小

private int xytextcolor;//xy坐标轴文字颜色

private int xytextsize;//xy坐标轴文字大小

private int linecolor;//折线的颜色

private int interval;//坐标间的间隔

private int bgColor;//背景颜色

private List x_coords;//x坐标点的值

private List x_coord_values;//每个点状态值

private int width;//控件宽度

private int heigth;//控件高度

private int imageWidth;//表情的宽度

private float textwidth;//y轴文字的宽度

float startX=0;//滑动时候，上一次手指的x坐标

在构造函数中读取各个属性值：

public LineCharView(Context context, AttributeSet attrs) {

super(context, attrs);

TypedArray typedArray= context.obtainStyledAttributes(attrs, R.styleable.LineChar);

xylinecolor=typedArray.getColor(R.styleable.LineChar_xylinecolor, Color.GRAY);

xylinewidth