Android自定义view之绘制实用型的柱形图和折线图

概述：

前几天突然需要做两种图表——柱形图、折线图，于是第一反应是先看看网上有没有现成的，结果有是有，但都不是我想要的，而且大多数不是用纯android代码完成，HTML5似乎完成这类工作要容易得多，但是我本人并不会HTML5，只能黯然神伤，掩面流泪，最终只能自己敲代码了。

**知识点：**android自定义view、图形图像、Fragment、MVC模式。

Demo

界面是模仿红圈营销搭建的

折线图：

代码,注释很详细，直接看代码就行了：

public class LineChartView extends View {    private int width;    private int height;    private float maxValue;//传入数据的最大值    private int dataNum;//数据总数    private Paint mPaintBg;//报表背景画笔    private Paint mPaintCoveredBg;//用于画数据覆盖部分    private Paint mPaintChartLine;//用于画报表的网格    private Paint mPaintDataLine;//用于画数据连线    private Paint mPaintTextDate;//用于画日期文本    private Paint mPaintCircle;//用于画空心圆    private Paint mPaintFilledCircle;//用于画实心圆    private Paint mPaintTextValue;//用于画数据访问量值    private Path path;    private HashMap<Integer, PageViewData> dataTotal;//用于得存储传入的总数据    //用一个setPaints（）方法，设定所有画笔的属性，增加代码灵活性    public void setPaints(int bgColor, int coveredBgColor, int chartLineColor            , int dataLineColor, int textDateColor, int filledCircleColor, int circleColor, int textValueColor) {        mPaintBg.setColor(bgColor);        mPaintBg.setStyle(Paint.Style.FILL);        mPaintCoveredBg.setColor(coveredBgColor);        mPaintCoveredBg.setStyle(Paint.Style.FILL);        mPaintCircle.setColor(circleColor);        mPaintCircle.setStyle(Paint.Style.STROKE);        mPaintCircle.setStrokeWidth(5);        mPaintCircle.setAntiAlias(true);        mPaintFilledCircle.setColor(filledCircleColor);        mPaintFilledCircle.setStyle(Paint.Style.FILL);        mPaintFilledCircle.setAntiAlias(true);        mPaintChartLine.setColor(chartLineColor);        mPaintChartLine.setStyle(Paint.Style.STROKE);        mPaintChartLine.setAntiAlias(true);        mPaintDataLine.setColor(dataLineColor);        mPaintDataLine.setStyle(Paint.Style.STROKE);        mPaintDataLine.setStrokeWidth(SizeConvert.dip2px(getContext(), 5));        mPaintDataLine.setAntiAlias(true);        mPaintTextDate.setColor(textDateColor);        mPaintTextDate.setTextSize(SizeConvert.dip2px(getContext(), 10));        mPaintTextDate.setTextAlign(Paint.Align.CENTER);        mPaintTextDate.setAntiAlias(true);        mPaintTextValue.setColor(textValueColor);        mPaintTextValue.setTextSize(SizeConvert.dip2px(getContext(), 12));        mPaintTextValue.setTextAlign(Paint.Align.CENTER);        mPaintTextValue.setAntiAlias(true);        //重绘        invalidate();    }    //用于设定传入的总数据    public void setDataTotal(HashMap<Integer, PageViewData> dataTotal) {        this.dataTotal = dataTotal;        invalidate();    }    public LineChartView(Context context) {        super(context);    }    public LineChartView(Context context, AttributeSet attrs) {        super(context, attrs);        mPaintBg = new Paint();        mPaintCoveredBg = new Paint();        mPaintCircle = new Paint();        mPaintChartLine = new Paint();        mPaintDataLine = new Paint();        mPaintTextDate = new Paint();        mPaintTextValue = new Paint();        mPaintFilledCircle = new Paint();        path = new Path();        dataTotal = new HashMap<>();    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        //当总数据已经传入，即不为空时，根据总数据中数据个数设定view的总宽        if (dataTotal != null) {            width = (dataTotal.size() - 1) * xAddedNum + chartMarginHorizontal * 2;            getMaxValue(dataTotal);        }        height = getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec);        setMeasuredDimension(width, height);    }    /**     * 用于得到总数据中最大数据     * @param dataTotal 总数据     */    private void getMaxValue(HashMap<Integer, PageViewData> dataTotal) {        maxValue = 0;        dataNum = 0;        for (int key : dataTotal.keySet()) {            if (dataTotal.get(key).getPageViewValue() > maxValue) {                maxValue = dataTotal.get(key).getPageViewValue();            }            dataNum++;        }    }    private int mChartHeight;//折线图的高    private int mChartWidth;//折线图的    private int startX = SizeConvert.dip2px(getContext(), 10);//开始绘制的x坐标    private int startY = SizeConvert.dip2px(getContext(), 5);//开始绘制的y坐标    private int chartMarginBottom = SizeConvert.dip2px(getContext(), 30);//折线图距离父控件底部距离    private int chartMarginHorizontal = SizeConvert.dip2px(getContext(), 12);//折线图距离父控件左右的距离    private int valueAlignLeft = SizeConvert.dip2px(getContext(), 0);//value参数文本距离左边距离    private int dateAlignLeft = SizeConvert.dip2px(getContext(), 0);//date参数文本距离左边距离    private int valueAlignBottom = SizeConvert.dip2px(getContext(), 5);//value参数文本距离底部距离    private int dateAlignBottom = SizeConvert.dip2px(getContext(), 10);//date参数文本距离底部距离    private int xAddedNum = SizeConvert.dip2px(getContext(), 60);//绘制折线图时每次移动的x轴距离    private int yAddedNum;//绘制折线图时每次移动的y轴距离    private boolean isDrawFirst;//是否是第一次绘制    private float circleFilledRadius = SizeConvert.dip2px(getContext(), 5);//外圆半径    private float circleRadius = SizeConvert.dip2px(getContext(), 3);//内圆半径    private float firstX;//第一个点的x轴坐标    private float firstY;//第一个点的y轴坐标    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        isDrawFirst = true;        mChartHeight = height - chartMarginBottom;        yAddedNum = mChartHeight / 4;        mChartWidth = width - chartMarginHorizontal * 2;        canvas.drawRect(startX, startY, startX + mChartWidth, startY + mChartHeight, mPaintBg);        for (int key : dataTotal.keySet()) {            float value = dataTotal.get(key).getPageViewValue();            if (isDrawFirst) {                //当第一次绘制时得到第一个点的横纵坐标                firstX = startX;                firstY = startY + (1f - value / ((int) maxValue * 1.5f)) * mChartHeight;                path.moveTo(firstX, firstY);                isDrawFirst = false;            }            //每循环一次，将path线性相位一次            path.lineTo(startX, startY + (1f - value / ((int) maxValue * 1.5f)) * mChartHeight);            startX += xAddedNum;        }        //重新给startX赋值        startX = SizeConvert.dip2px(getContext(), 10);        //画出折线        canvas.drawPath(path, mPaintDataLine);        //画出折线以下部分的颜色        path.lineTo(startX + mChartWidth, startY + mChartHeight);        path.lineTo(startX, startY + mChartHeight);        path.lineTo(firstX, firstY);        canvas.drawPath(path, mPaintCoveredBg);        //画出每个点的圆圈，和对应的文本        for (int key : dataTotal.keySet()) {            int date = dataTotal.get(key).getDate();            float value = dataTotal.get(key).getPageViewValue();            canvas.drawCircle(startX, startY + (1f - value / ((int) maxValue * 1.5f)) * mChartHeight, circleFilledRadius, mPaintFilledCircle);            canvas.drawCircle(startX, startY + (1f - value / ((int) maxValue * 1.5f)) * mChartHeight, circleRadius, mPaintCircle);            canvas.drawText(date + "", startX + dateAlignLeft, height - dateAlignBottom, mPaintTextDate);            canvas.drawText(value + "", startX + valueAlignLeft, startY + (1f - value / ((int) maxValue * 1.5f)) * mChartHeight - valueAlignBottom, mPaintTextValue);            startX += xAddedNum;        }        //在次使startX回到初始值        startX = SizeConvert.dip2px(getContext(), 10);        /**         * 画出网格         */        //竖线        for (int i = 0; i < dataNum; i++) {            canvas.drawLine(startX + i * xAddedNum, startY, startX + i * xAddedNum, startY + mChartHeight, mPaintChartLine);        }        //横线        for (int i = 0; i < 5; i++) {            canvas.drawLine(startX, startY + i * yAddedNum, startX + mChartWidth, startY + i * yAddedNum, mPaintChartLine);        }        path.reset();    }}

柱形图：

代码：

/** * 柱形图 */public class HistogramView extends View {    private int width;    private int height;    private Paint mBgPaint;    private Paint mHistogramBgPaint;    private Paint mHistogramPaint;    private Paint mTextPaint;    private HashMap<Integer,HistogramData> dataTotal;    public void setPaints(int bgColor,int histogramBgColor,int histogramColor,int textColor){        mBgPaint.setColor(bgColor);        mBgPaint.setStyle(Paint.Style.FILL);        mHistogramBgPaint.setColor(histogramBgColor);        mHistogramBgPaint.setStyle(Paint.Style.FILL);        mHistogramPaint.setColor(histogramColor);        mHistogramPaint.setStyle(Paint.Style.FILL);        mTextPaint.setColor(textColor);        mTextPaint.setTextSize(SizeConvert.dip2px(getContext(), 9));        mTextPaint.setTextAlign(Paint.Align.CENTER);        invalidate();    };    public void setDataTotal(HashMap<Integer, HistogramData> dataTotal) {        this.dataTotal = dataTotal;        invalidate();    }    public HistogramView(Context context) {        super(context);    }    public HistogramView(Context context, AttributeSet attrs) {        super(context, attrs);        mHistogramBgPaint = new Paint();        mHistogramPaint = new Paint();        mTextPaint = new Paint();        mBgPaint = new Paint();        dataTotal = new HashMap<>();    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        if(dataTotal!=null){            width = dataTotal.size()*SizeConvert.dip2px(getContext(), 40);        }        height = getDefaultSize(getSuggestedMinimumHeight(),heightMeasureSpec);        setMeasuredDimension(width, height);    }    private int mHistogramHeight;    int startX = SizeConvert.dip2px(getContext(), 20);    int startY = SizeConvert.dip2px(getContext(),20);    int radius = 45;    int greyValueAlignLeft = SizeConvert.dip2px(getContext(), 5);    int nameAlignLeft = SizeConvert.dip2px(getContext(), 15);    int greyValueAlignBottom = SizeConvert.dip2px(getContext(), 5);    int nameAlignBottom = SizeConvert.dip2px(getContext(), 15);    int histogramWidth = SizeConvert.dip2px(getContext(), 8);    int xAddedNum = SizeConvert.dip2px(getContext(), 40);    int histogramAlignTop = SizeConvert.dip2px(getContext(), 2);    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        mHistogramHeight = height-SizeConvert.dip2px(getContext(),40);        canvas.drawRect(0,startY,width,mHistogramHeight,mBgPaint);        for(int key:dataTotal.keySet()){            String name = dataTotal.get(key).getName();            int greyValue = dataTotal.get(key).getGreyValue();            canvas.drawText(greyValue + "%", startX + greyValueAlignLeft, startY-greyValueAlignBottom , mTextPaint);            canvas.drawRect(startX, startY+histogramAlignTop, startX + histogramWidth, mHistogramHeight, mHistogramBgPaint);            canvas.drawRect(startX, startY+(1f - greyValue / 100f) * (mHistogramHeight - startY-histogramAlignTop)+histogramAlignTop, startX + histogramWidth, mHistogramHeight, mHistogramPaint);            canvas.save();            canvas.rotate(-radius, startX,height);            canvas.drawText(name, startX + nameAlignLeft, height-nameAlignBottom, mTextPaint);            canvas.restore();            startX+=xAddedNum;        }        startX = SizeConvert.dip2px(getContext(), 20);    }}

Fragment

public class FragmentChart extends Fragment implements View.OnClickListener{    private RelativeLayout mItemFirst;    private RelativeLayout mItemSecond;    private RelativeLayout mItemThird;    private RelativeLayout mItemForth;    private HistogramView mHistogramView;    private HashMap<Integer,HistogramData> mDataHistogramTotal;    private boolean isShowHistogram = false;    private LineChartView mLineChartView;    private HashMap<Integer,PageViewData> mDataPageView;    private boolean isShowSecondItem = false;    @Nullable    @Override    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {        View view = inflater.inflate(R.layout.content_chart,null);        mItemFirst = (RelativeLayout) view.findViewById(R.id.first_page_item_1);        mItemSecond = (RelativeLayout) view.findViewById(R.id.first_page_item_2);        mItemThird = (RelativeLayout) view.findViewById(R.id.first_page_item_3);        mItemForth = (RelativeLayout) view.findViewById(R.id.first_page_item_4);        mHistogramView = (HistogramView) view.findViewById(R.id.histogram_view_item_1);        mLineChartView = (LineChartView) view.findViewById(R.id.line_chart_view_item_2);        mItemFirst.setOnClickListener(this);        mItemSecond.setOnClickListener(this);        mItemThird.setOnClickListener(this);        mItemForth.setOnClickListener(this);        initDataHistogram();        initDataPageView();        return view;    }    private void initDataPageView() {        mDataPageView = new HashMap<>();        mDataPageView.put(1,new PageViewData(1,9,16));        mDataPageView.put(2,new PageViewData(2,10,18));        mDataPageView.put(3,new PageViewData(3,11,33));        mDataPageView.put(4,new PageViewData(4,12,97));        mDataPageView.put(5,new PageViewData(5,13,46));        mDataPageView.put(6,new PageViewData(6,14,55));        mDataPageView.put(7,new PageViewData(7,15,11));        mDataPageView.put(8,new PageViewData(8,16,22));        mDataPageView.put(9,new PageViewData(9,17,8));        mDataPageView.put(10,new PageViewData(10,18,19));        mDataPageView.put(11,new PageViewData(11,16,22));        mLineChartView.setDataTotal(mDataPageView);        mLineChartView.setPaints(Color.argb(255,225, 250, 250),                Color.argb(255,234, 234, 250), Color.argb(255,74,208, 204),                Color.argb(255,105, 210, 249),Color.argb(255,203, 203, 203)                ,Color.argb(255,255, 255, 255),Color.argb(255,105, 210, 249),Color.argb(255,105, 210, 249));    }    private void initDataHistogram(){        mDataHistogramTotal = new HashMap<>();        mDataHistogramTotal.put(1,new HistogramData(1,"海萌",100));        mDataHistogramTotal.put(2,new HistogramData(2,"涛涛",18));        mDataHistogramTotal.put(3,new HistogramData(3,"火风",17));        mDataHistogramTotal.put(4,new HistogramData(4,"周杰伦",16));        mDataHistogramTotal.put(5,new HistogramData(5,"王宝强",15));        mDataHistogramTotal.put(6,new HistogramData(6,"林俊杰",14));        mDataHistogramTotal.put(7,new HistogramData(7,"孙悟空",11));        mDataHistogramTotal.put(8,new HistogramData(8,"钟航",10));        mDataHistogramTotal.put(9,new HistogramData(9,"小明",8));        mDataHistogramTotal.put(10, new HistogramData(10, "小红", 5));        mHistogramView.setDataTotal(mDataHistogramTotal);        mHistogramView.setPaints(Color.argb(255,250, 250, 250),                Color.argb(255,238, 238, 238), Color.argb(255,240,141, 77),                Color.argb(255,168, 168, 168));    }    @Override    public void onClick(View v) {        switch (v.getId()){            case R.id.first_page_item_1:                isShowHistogram = !isShowHistogram;                if(isShowHistogram) {                    mHistogramView.setVisibility(View.VISIBLE);                }else{                    mHistogramView.setVisibility(View.GONE);                }                break;            case R.id.first_page_item_2:                isShowSecondItem= !isShowSecondItem;                if(isShowSecondItem) {                    mLineChartView.setVisibility(View.VISIBLE);                }else{                    mLineChartView.setVisibility(View.GONE);                }                break;            case R.id.first_page_item_3:                break;            case R.id.first_page_item_4:                break;        }    }}

主活动：

public class MainActivity extends FragmentActivity {    private FragmentChart mFragmentChart;    private RadioGroup mRadioGroup;    private FragmentTransaction transaction;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mFragmentChart = new FragmentChart();        mFragmentManager = getSupportFragmentManager();        transaction = mFragmentManager.beginTransaction();        transaction.add(R.id.frame_layout, mFragmentChart);        transaction.commit();        mRadioGroup = (RadioGroup) findViewById(R.id.radiogroup);        mRadioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {            @Override            public void onCheckedChanged(RadioGroup group, int checkedId) {                switch (checkedId) {                    case R.id.button1:                        transaction = mFragmentManager.beginTransaction();                        transaction.hide(mFragmentChat);                        transaction.hide(mFragmentSetting);                        transaction.hide(mFragmentWork);                        transaction.show(mFragmentChart);                        transaction.commit();                        break;                }            }        });    }}

activity_main:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"              android:layout_width="match_parent"              android:layout_height="match_parent"              android:orientation="vertical"    >    <FrameLayout        android:id="@+id/frame_layout"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:layout_weight="1">    </FrameLayout>    <RadioGroup        android:id="@+id/radiogroup"        android:layout_width="match_parent"        android:layout_height="60dp"        android:layout_alignParentBottom="true"        android:background="@color/light_gray"        android:checkedButton="@+id/button1"        android:gravity="center_vertical"        android:orientation="horizontal"        android:padding="2dp">        <RadioButton            android:id="@+id/button1"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="@null"            android:button="@null"            android:drawableTop="@drawable/radio_button_chart"            android:gravity="center"            android:text="报表"            android:textColor="@color/radio_button_text_color"            />        <RadioButton            android:id="@+id/button2"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/radio_button_chat"            android:gravity="center"            android:text="沟通"            android:textColor="@color/radio_button_text_color"            />        <RadioButton            android:id="@+id/button3"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/radio_button_work"            android:gravity="center"            android:text="工作"            android:textColor="@color/radio_button_text_color"            />        <RadioButton            android:id="@+id/button4"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:button="@null"            android:drawableTop="@drawable/radio_button_setting"            android:gravity="center"            android:text="更多"            android:textColor="@color/radio_button_text_color"            />    </RadioGroup></LinearLayout>

content_chart:

<?xml version="1.0" encoding="utf-8"?><ScrollView xmlns:android="http://schemas.android.com/apk/res/android"            android:layout_width="match_parent"            android:layout_height="match_parent">    <LinearLayout        android:layout_width="match_parent"        android:layout_height="match_parent"        android:background="@color/background"        android:orientation="vertical">        <RelativeLayout            android:layout_width="match_parent"            android:layout_height="60dp"            android:background="@drawable/item_bg">            <TextView                android:id="@+id/textview"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_centerInParent="true"                android:text="报表"                android:textSize="20sp"/>            <ImageView                android:id="@+id/image_button"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_alignParentRight="true"                android:layout_centerVertical="true"                android:layout_margin="20dp"                android:src="@mipmap/report_subscribe"/>        </RelativeLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="match_parent"            android:orientation="vertical">            <RelativeLayout                android:id="@+id/first_page_item_1"                android:layout_width="match_parent"                android:layout_height="@dimen/first_page_item_height"                android:layout_marginTop="@dimen/first_page_item_margin_top"                android:background="@drawable/item_bg"                android:gravity="center_vertical">                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:orientation="vertical">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:layout_margin="@dimen/first_page_item_left_padding"                        android:text="随时定位"                        android:textColor="@color/black"                        android:textSize="@dimen/first_page_item_left_big_size"/>                    <LinearLayout                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:orientation="horizontal">                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:drawableTop="@mipmap/red_point_people"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:text="48"                            android:textSize="@dimen/first_page_item_right_small_size"/>                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:drawableTop="@mipmap/blue_point_people"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:text="16"                            android:textSize="@dimen/first_page_item_right_small_size"/>                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:drawableTop="@mipmap/grey_point_people"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:text="16"                            android:textSize="@dimen/first_page_item_right_small_size"/>                    </LinearLayout>                </LinearLayout>                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="match_parent"                    android:layout_alignParentRight="true"                    android:gravity="center|right"                    android:orientation="vertical"                    android:paddingRight="@dimen/first_page_item_left_padding">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="12%"                        android:textColor="@color/orange"                        android:textSize="@dimen/first_page_item_right_big_size"/>                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="今日人均灰点率"                        android:textSize="@dimen/first_page_item_right_small_size"/>                </LinearLayout>            </RelativeLayout>            <HorizontalScrollView                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:scrollbars="none">                <com.test.shiweiwei.myproject.selfish_view.HistogramView                    android:id="@+id/histogram_view_item_1"                    android:layout_width="wrap_content"                    android:layout_height="160dp"                    android:background="@drawable/item_bg"                    android:visibility="gone"/>            </HorizontalScrollView>            <RelativeLayout                android:id="@+id/first_page_item_2"                android:layout_width="match_parent"                android:layout_height="@dimen/first_page_item_height"                android:layout_marginTop="@dimen/first_page_item_margin_top"                android:background="@drawable/item_bg"                android:gravity="center_vertical">                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:gravity="center_vertical"                    android:orientation="vertical">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:layout_margin="@dimen/first_page_item_left_padding"                        android:text="客户拜访"                        android:textColor="@color/black"                        android:textSize="@dimen/first_page_item_left_big_size"/>                    <LinearLayout                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:orientation="vertical">                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:text="10月人均拜访:1.7"                            android:textSize="@dimen/first_page_item_right_small_size"/>                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:paddingTop="5dp"                            android:text="昨日总拜访:9"                            android:textSize="@dimen/first_page_item_right_small_size"/>                    </LinearLayout>                </LinearLayout>                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="match_parent"                    android:layout_alignParentRight="true"                    android:gravity="center|right"                    android:orientation="vertical"                    android:paddingRight="@dimen/first_page_item_left_padding">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="3.0"                        android:textColor="@color/light_blue"                        android:textSize="@dimen/first_page_item_right_big_size"/>                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="昨日人均拜访"                        android:textSize="@dimen/first_page_item_right_small_size"/>                </LinearLayout>            </RelativeLayout>            <HorizontalScrollView                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:scrollbars="none">                <com.test.shiweiwei.myproject.selfish_view.LineChartView                    android:id="@+id/line_chart_view_item_2"                    android:layout_width="wrap_content"                    android:layout_height="160dp"                    android:background="@drawable/item_bg"                    android:visibility="gone"/>            </HorizontalScrollView>            <RelativeLayout                android:id="@+id/first_page_item_3"                android:layout_width="match_parent"                android:layout_height="@dimen/first_page_item_height"                android:layout_marginTop="@dimen/first_page_item_margin_top"                android:background="@drawable/item_bg"                android:gravity="center_vertical">                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:gravity="center_vertical"                    android:orientation="vertical">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:layout_margin="@dimen/first_page_item_left_padding"                        android:text="新增客户-全部"                        android:textColor="@color/black"                        android:textSize="@dimen/first_page_item_left_big_size"/>                    <LinearLayout                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:orientation="vertical">                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:text="10月日均增长量:3.0"                            android:textSize="@dimen/first_page_item_right_small_size"/>                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:paddingTop="@dimen/first_page_item_left_padding_top"                            android:text="十月新增客户:21"                            android:textSize="@dimen/first_page_item_right_small_size"/>                    </LinearLayout>                </LinearLayout>                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="match_parent"                    android:layout_alignParentRight="true"                    android:gravity="center|right"                    android:orientation="vertical"                    android:paddingRight="@dimen/first_page_item_left_padding">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="3"                        android:textColor="@color/light_green"                        android:textSize="@dimen/first_page_item_right_big_size"/>                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="昨日新增客户"                        android:textSize="@dimen/first_page_item_right_small_size"/>                </LinearLayout>            </RelativeLayout>            <RelativeLayout                android:id="@+id/first_page_item_4"                android:layout_width="match_parent"                android:layout_height="@dimen/first_page_item_height"                android:layout_marginTop="@dimen/first_page_item_margin_top"                android:background="@drawable/item_bg"                android:gravity="center_vertical">                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="wrap_content"                    android:gravity="center_vertical"                    android:orientation="vertical">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:layout_margin="@dimen/first_page_item_left_padding"                        android:text="客户总量-全部"                        android:textColor="@color/black"                        android:textSize="@dimen/first_page_item_left_big_size"/>                    <LinearLayout                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:orientation="vertical">                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:text="昨日净增客户:3.0"                            android:textSize="@dimen/first_page_item_right_small_size"/>                        <TextView                            android:layout_width="wrap_content"                            android:layout_height="wrap_content"                            android:gravity="center"                            android:paddingLeft="@dimen/first_page_item_left_padding"                            android:paddingRight="@dimen/first_page_item_left_padding"                            android:paddingTop="@dimen/first_page_item_left_padding_top"                            android:text="十月净增客户:-1"                            android:textSize="@dimen/first_page_item_right_small_size"/>                    </LinearLayout>                </LinearLayout>                <LinearLayout                    android:layout_width="wrap_content"                    android:layout_height="match_parent"                    android:layout_alignParentRight="true"                    android:gravity="center|right"                    android:orientation="vertical"                    android:paddingRight="@dimen/first_page_item_left_padding">                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="21"                        android:textColor="@color/purple"                        android:textSize="@dimen/first_page_item_right_big_size"/>                    <TextView                        android:layout_width="wrap_content"                        android:layout_height="wrap_content"                        android:text="总客户数"                        android:textSize="@dimen/first_page_item_right_small_size"/>                </LinearLayout>            </RelativeLayout>        </LinearLayout>    </LinearLayout></ScrollView>

我们猿类工作压力大，很需要有自己的乐趣，于是乎，我开通了音乐人账号，以后的作品将会上传到我的音乐人小站上。如果这篇博客帮助到您，希望您能多关注，支持，鼓励我将创作进行下去，同时也祝你能在工作和生活乐趣两发面都能出彩！

网易云音乐人，直接打开客户端搜索音乐人 “星河河”

豆瓣音乐人地址：https://site.douban.com/chuxinghe/ 星河河