一些强大的第三方控件

    1. PhotoView
    1. CutomShapeImageView
    1. MPAndroidChart

1. PhotoView

一个让图片随着收缩放大移动的类库,使用简单,缩放流畅.目前大部分app的缩放效果都是使用这个,
github地址:https://github.com/chrisbanes/PhotoView,其作者是Google官方Android工程师ChrisBane

原理:对ImageView添加OnTouchListener和GestureDecetor用来检查触摸移动的距离,以及双击事件,多点触摸的距离,
然后通过更改ImageView的Martrix来实现移动,缩放图片

用法如下:

  • 单独使用ImageView的时候,使用PhotoView替换掉ImageView即可:
PhotoView mPhotoView = new PhotoView(this);

  • 在ViewPager中使用的时候请使用HackyViewPager
public class HackyViewPager extends ViewPager {
private boolean isLocked;
public HackyViewPager(Context context) {
    super(context);
    isLocked = false;
}
public HackyViewPager(Context context, AttributeSet attrs) {
    super(context, attrs);
    isLocked = false;
}
@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
    if (!isLocked) {
        try {
            return super.onInterceptTouchEvent(ev);
        } catch (IllegalArgumentException e) {
            e.printStackTrace();
            return false;
        }
    }
    return false;
}
@Override
public boolean onTouchEvent(MotionEvent event) {
    return !isLocked && super.onTouchEvent(event);
}
public void toggleLock() {
    isLocked = !isLocked;
}
public void setLocked(boolean isLocked) {
    this.isLocked = isLocked;
}
public boolean isLocked() {
    return isLocked;
}
}

2. CutomShapeImageView

特点:可让你的ImageView自定义形状,包括但不限于圆形,矩形,三角形,以及各种不规则图形,
github地址:https://github.com/MostafaGazar/CustomShapeImageView

原理:BaseImageView在onDraw方法中去首先绘制src图片,再绘制遮罩图片(maskBitmap),需要注意的是绘制遮罩图片时候使用的Xfermode为PorterDuff.Mode.DST_IN,即在2图交集区域取目标图片的内容;

遮罩图片通过getBitmap()方法获取,该方法由子类实现:CircleImageView的实现是返回一个圆形空白图片,RectangleImageView的实现是返回一个矩形空白图片,SvgImageView的实现是将svg格式的图片解析成bitmap;

SVG介绍:
全称为ScaleVectorGraphic,即可伸缩的矢量图;
特点:体积小,不会失真,通过xml描述,所以可以直接被文本编辑器来修改和查看; 属于W3C标准之一;
详情查看:http://blog.csdn.net/tianjian4592/article/details/44733123/

用法如下:

  • 使用CircleImageView,只需给src指定底图就行:

  • 使用RectangleImageView,同样只需要指定src底图:
 
  • 使用SvgImageView,需要给它指定一张svg格式的图片资源:


3. MPAndroidChart

一个非常强大的用于数据统计展示的View,支持多样的折线图,柱状图,饼状图,网状图,点状图等等,基本上可以满足我们所有的需求,
github地址:https://github.com/PhilJay/MPAndroidChart

基类Chart继承ViewGroup,在onDraw基本没有做什么事;
有很多实现类,如LineChart(线状图),BarChart(柱状图),PieChart(饼状图)等,他们都重写了onDraw方法,并按照如下步骤绘制出内容:

//1.绘制背景
drawGridBackground(canvas);
//2.绘制X,y轴线
mXAxisRenderer.renderAxisLine(canvas);
mAxisRendererLeft.renderAxisLine(canvas);
mAxisRendererRight.renderAxisLine(canvas);
//3.绘制网格线
mXAxisRenderer.renderGridLines(canvas);
mAxisRendererLeft.renderGridLines(canvas);
mAxisRendererRight.renderGridLines(canvas);
//4.绘制图形数据,如绘制线,绘制柱形,绘制饼状
mRenderer.drawData(canvas);
//5.绘制单位标签
mXAxisRenderer.renderAxisLabels(canvas);
mAxisRendererLeft.renderAxisLabels(canvas);
mAxisRendererRight.renderAxisLabels(canvas)
//6.绘制图形的数值
mRenderer.drawValues(canvas);
//7.绘制mark标记
drawMarkers(canvas);
//8.绘制表格描述说明
drawDescription(canvas);

用法如下(只拿线状图,柱状图,饼状图举例):

    1. 如何使用线状图:
mChart = (LineChart) findViewById(R.id.line_chart);

//设置没有数据时候展示的文本
mChart.setNoDataText("目前木有数据哦");

//1.给Chart设置数据
mChart.setData(getLineData());

//2.设置y轴的取值范围
YAxis axisLeft = mChart.getAxisLeft();
//设置y轴最小值
axisLeft.setAxisMinValue(0);
//设置y轴最大值
axisLeft.setAxisMaxValue(50);

//3.设置去掉右边的y轴线
YAxis axisRight = mChart.getAxisRight();
axisRight.setEnabled(false);

//4.设置是否启用x轴线
XAxis xAxis = mChart.getXAxis();
xAxis.setEnabled(true);//显示x轴线

//5.设置表格描述信息
mChart.setDescription("表格描述");

//6.设置是否绘制表格背景
mChart.setDrawGridBackground(true);
//设置表格网格背景的颜色
//mChart.setGridBackgroundColor(Color.BLUE);

//7.设置绘制动画的时间
mChart.animateXY(3000,3000);

    1. 给线状图准备数据,需要构造LineDataSet,每一条线的数据就是一个LineDataSet对象, 该对象可以设置线的颜色,线条的标签,粗细等
public LineData getLineData() {
    int maxX = 10;
    List entryList = new ArrayList<>();
    List entryList2 = new ArrayList<>();
    for (int i=0;i list = new ArrayList<>();
    //存放一条线的数据
    list.add(dataSet);
    list.add(dataSet2);

    //生成x轴的数据
    List xVals = ChartData.generateXVals(0, maxX);
    LineData lineData = new LineData(xVals,list);

    return lineData;
}

    1. 如何使用柱状图:
//创建条形数据对象
BarChart barChart = new BarChart(this);
setContentView(barChart);

//设置条形数据
barChart.setData(getBarData());

//设置描述
barChart.setDescription("2016行业薪资比较");

//设置绘制bar的阴影
barChart.setDrawBarShadow(true);

//设置绘制的动画时间
barChart.animateXY(3000,3000);

    1. 如何给柱状图设置数据,主要是构造BarDataSet对象,它需要一个装有BarEntry的集合, 每一个柱形都是一个BarEntry:
public BarData getBarData() {
int maxX = 10;

//创建集合,存放每个柱子的数据
List list = new ArrayList<>();
List list2 = new ArrayList<>();
for (int i=0;i dataSets = new ArrayList<>();
dataSets.add(barSet);
dataSets.add(barSet2);

BarData barData = new BarData(ChartData.generateXVals(0,maxX),dataSets);
return barData;

  • 5 如何使用饼状图:
PieChart pieChart = new PieChart(this);
setContentView(pieChart);

//设置饼状图数据
pieChart.setData(getPieData());

//设置描述
pieChart.setDescription("胡萝卜维生素成分比例");
pieChart.setDescriptionTextSize(20);

//设置中心说明文字
pieChart.setCenterText("中心说明文字");
pieChart.setCenterTextSize(20);
pieChart.setCenterTextColor(Color.RED);

pieChart.animateXY(3000,3000);

  • 6 如何给饼状图设置数据,主要构造PieData对象,它需要一个PieDataSet对象,set对象是装满Entry的集合,封装的是饼状百分比和位置的映射:

public PieData getPieData() {
    ArrayList list = new ArrayList<>();
    for (int i=0;i<3;i++){
        //一个Entry就是一个饼块
        Entry entry = new Entry(i+2,i);
        list.add(entry);
    }

    //创建一组饼块的数据
    PieDataSet pieDataSet = new PieDataSet(list,"标签");

    //设置饼块的间距
    pieDataSet.setSliceSpace(4);
    //设置饼快颜色
    pieDataSet.setColors(new int[]{Color.RED,Color.GREEN,Color.BLUE});

    //创建x轴
    ArrayList xList = new ArrayList<>();
    xList.add("维生素A");
    xList.add("维生素B");
    xList.add("维生素C");

    PieData pieData = new PieData(xList,pieDataSet);
    return pieData;
}

你可能感兴趣的:(一些强大的第三方控件)