在片段中为视图设置动画

时间:2016-07-03 15:58:59

标签: android android-fragments animation android-animation

我为我的Android应用程序创建了一个自定义的半圆形图(破折号图表)(我找不到任何库来执行它。如果你知道任何评论)。

编辑:我尝试为其条目设置动画(详细信息如下),但它不起作用。所以我开始搜索如何为片段中的普通TextViewImageView制作动画,但我无法这样做。现在我正在更改帖子,以便人们可以学习如何在片段中为视图(不仅仅是自定义视图)设置动画。任何说明如何为片段中的视图设置动画的答案都是受欢迎的。

代码如下

  public class DonutChart extends View {
    private float radius;
    Paint paint;
    Paint shadowPaint;
    int a,b,c;
    Path myPath;
    Path shadowPath;
    RectF outterCircle;
    RectF innerCircle;
    RectF shadowRectF;
    public DonutChart(Context context, AttributeSet attrs) {
        super(context, attrs);

        TypedArray a = context.getTheme().obtainStyledAttributes(attrs,R.styleable.DonutChart,0, 0);

        try {
            radius = a.getDimension(R.styleable.DonutChart_radius, 20.0f);
        } finally {
            a.recycle();
        }
        paint = new Paint();
        paint.setDither(true);
        paint.setStyle(Paint.Style.FILL);
        paint.setStrokeJoin(Paint.Join.ROUND);
        paint.setStrokeCap(Paint.Cap.ROUND);
        paint.setAntiAlias(true);
        paint.setStrokeWidth(radius / 14.0f);
        shadowPaint = new Paint();
        shadowPaint.setColor(0xf0000000);
        shadowPaint.setStyle(Paint.Style.STROKE);
        shadowPaint.setAntiAlias(true);
        shadowPaint.setStrokeWidth(6.0f);
        shadowPaint.setMaskFilter(new BlurMaskFilter(4, BlurMaskFilter.Blur.SOLID));
        myPath = new Path();
        shadowPath = new Path();
        outterCircle = new RectF();
        innerCircle = new RectF();
        shadowRectF = new RectF();
        float adjust = (.019f*radius);
        shadowRectF.set(adjust, adjust, radius*2-adjust, radius*2-adjust);
        adjust = .038f * radius;
        outterCircle.set(adjust, adjust, radius*2-adjust, radius*2-adjust);
        adjust = .276f * radius;
        innerCircle.set(adjust, adjust, radius * 2 - adjust, radius * 2 - adjust);
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // draw shadow
        paint.setShader(null);
        float adjust = (.0095f*radius);
        paint.setShadowLayer(8, adjust, -adjust, 0xaa000000);
        drawDonut(canvas, paint, 180, (180+a+b+c));
        //Maroon
        //setGradient(0xff84BC3D,0xff5B8829);
        setGradient(0xffffb300,0xffffb300);
        drawDonut(canvas,paint, (180+a),b);
        //Violet
        //setGradient(0xffe04a2f,0xffB7161B);
        setGradient(0xffd32f2f,0xfff44336);
        drawDonut(canvas, paint, 180,a);
        // White
       // setGradient(Color.TRANSPARENT,Color.TRANSPARENT);
        //drawDonut(canvas, paint, 0, 180);
        // Green
        setGradient(0xff388e3c,0xff66bb6a);
        drawDonut(canvas, paint,(180+a+b),c);
    }
    public void drawDonut(Canvas canvas, Paint paint, float start,float sweep){

        myPath.reset();
        myPath.arcTo(outterCircle, start, sweep, false);
        myPath.arcTo(innerCircle, start+sweep, -sweep, false);
        myPath.close();
        canvas.drawPath(myPath, paint);
    }

    public void setGradient(int sColor, int eColor){
        paint.setShader(new RadialGradient(radius, radius, radius - 5,
                new int[]{sColor, eColor},
                new float[]{.6f, .95f}, TileMode.CLAMP));
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int desiredWidth = (int) radius*2;
        int desiredHeight = (int) radius*2;
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int heightMode = MeasureSpec.getMode(heightMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);
        int width;
        int height;
        //70dp exact
        if (widthMode == MeasureSpec.EXACTLY) {
            width = widthSize;
        }else if (widthMode == MeasureSpec.AT_MOST) {
            //wrap content
            width = Math.min(desiredWidth, widthSize);
        } else {
            width = desiredWidth;
        }
        //Measure Height
        if (heightMode == MeasureSpec.EXACTLY) {
            height = heightSize;
        } else if (heightMode == MeasureSpec.AT_MOST) {
            height = Math.min(desiredHeight, heightSize);
        } else {
            height = desiredHeight;
        }
        //MUST CALL THIS
        setMeasuredDimension(width, height);
    }
    public void getData(int x,int y){
        invalidate();
        a=((x*180)/10);
        b=(y*180)/10;
        c=180-(a+b);
        a=90;
        b=40;
        c=(180-(a+b));
        //Toast.makeText(getContext(),"Inside Chart "+s1+" "+s2+" "+s3 +" "+String.valueOf(x),Toast.LENGTH_SHORT).show();
    }
}

图表的布局定义如下

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:customviews="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:background="@android:color/transparent"
    android:id="@+id/statistics_1_page"
    tools:context=".MainActivity">
    <com.spintum.preexam.DonutChart
        android:id="@+id/donutChart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        customviews:radius="100dp"
        android:gravity="center"
        android:layout_gravity="center"
        android:layout_marginTop="75dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/PerformanceRating"
        android:textSize="22sp"
        android:textStyle="bold"
        android:gravity="center"
        android:text="You Average Score is 80%"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/PerformanceRating_1"
        android:textSize="18sp"
        android:textStyle="bold|italic"
        android:layout_gravity="center"
        android:text="Don't Stop till you reach 100"/>

</LinearLayout>

我使用片段为布局充气,如下所示

public class Fragment_Statistics extends Fragment {
    DonutChart chart;
    public View onCreateView(LayoutInflater layoutInflater,ViewGroup container,Bundle SavedInstances){
        View statistics_fragment=getActivity().getLayoutInflater().inflate(R.layout.fragment_statistics, null);
        chart = (DonutChart) statistics_fragment.findViewById(R.id.donutChart);
        chart.getData(2, 2);
        final Handler handler = new Handler();
        handler.postDelayed(new Runnable() {
            @Override
            public void run() {
                //Delay and give the device enough time to render the chart

            }
        }, 2000);
        Animation animation_clock=AnimationUtils.loadAnimation(getActivity(),R.anim.clockwise);
        chart.startAnimation(animation_clock);
        return statistics_fragment;
    }

    @Override
    public void onResume() {
        super.onResume();
        chart.invalidate();
    }

片段中定义的ClockWise动画如下

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <rotate xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromDegrees="0"
        android:toDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="5000" >
    </rotate>

    <rotate xmlns:android="http://schemas.android.com/apk/res/android"
        android:startOffset="5000"
        android:fromDegrees="360"
        android:toDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="5000" >
    </rotate>

我认为我已经完成了所有操作,但没有创建动画,页面只显示图表..

有人可以告诉我我的代码有什么问题,还是有比我试图做的更好的方法呢?

0 个答案:

没有答案