Android resume (4)

The first step involved in technology-based custom control and custom control Animation: although the inherited custom control has implemented the required control, the function of this control is not powerful enough and it is not convenient to use. For example, let the color of the control vary with the size of the capacity value or the animation effect after clicking. At this time, a simple control will not work, and the control will become more convenient to use. Inherit from the custom Ring control created in the previous article. First, make it easier to control the color of the control. It is easy to control the color when using the following method:
That is, you only need to input the name, skill value, and skill color to create this control. Based on this idea, we can easily write the following code (where the color comes from this website, if you are interested, you can see ):

    public Skill(Context context, String name, int percent, int styleType) {        super(context);        this.context = context;        switch (styleType) {            case BLUE:                init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#004884"), percent);                break;            case GREEN:                init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#36B77D"), percent);                break;            case RED:                init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#ED1654"), percent);                break;            case PINK:                init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#EB9F9F"), percent);                break;            case YELLOW:                init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#E2A937"), percent);                break;        }

This init function is a Ring function of the parent class. Next, we can implement a construction method that automatically specifies the color based on the capability value, and we can use this method to generate controls of different colors in batches, we naturally define an xml to store data. The xml format is here. Xml parsing will not go into details. I use the pull method to parse the data and use the loop and our defined constructor to automatically produce controls. The constructor code is as follows:

    public Skill(Context context, int id, String name, int percent) {        super(context);        this.id = id;        this.context = context;        if(percent >= 90) {            init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#ED1654"), percent);        } else if (percent >= 80) {            init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#EB9F9F"), percent);        } else if (percent >= 75) {            init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#E2A937"), percent);        } else if (percent >= 65) {            init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#36B77D"), percent);        } else {            init(name, Color.WHITE, RING_WIDTH, Color.parseColor("#004884"), percent);        }        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(UI_WIDTH,UI_WIDTH);        this.setLayoutParams(lp);    }

In PagerActivity, the following controls can be created after being parsed to xml:

        if (skills != null) {            LinearLayout ll = (LinearLayout) skills.findViewById(R.id.skills_layout);            List<Map<String, Object>> skillList = SkillsParser.getSkillsList(context);            for (Map<String, Object> skill : skillList) {                Skill o = new Skill(context, Integer.parseInt((String) skill.get("id")), (String) skill.get("name"),                        Integer.parseInt((String) skill.get("point")));                ll.addView(o);            }        }

The constructor has an id to jump to the Activity to serve the service. The next step will be known. Step 2: I am not an interaction designer. I only have this imagination in my mind, so I can only come up with a shining effect. If you have any good ideas, you can try it on your own. I believe that after reading the code below, we will inspire you to develop any special effects in the future. What I want to do is to click the control, the control emits light waves, and the page becomes larger and fade in, and the following page fades in. The specific effect is as follows:
With the idea, we will analyze how the code should be implemented: 1. The control should be drawn first. 2. The control emits light. 3. Enter the next Activity after flashing. In fact, the analysis is quite simple. The first step is to call the onDraw of the parent class to implement it. The second step is to count with the help of touch events and variables. The third step is just a little bit of judgment. First, define such variables to record animation information:
We also need to re-write the onTouchEvent function for processing touch events:

    @Override    public boolean onTouchEvent(MotionEvent event) {        if (event.getAction() == MotionEvent.ACTION_UP) {            Log.i("Ring", "Action Up Speed: " + ANIMATE_SPEED);            touched = true;            ringAlpha = START_ALPHA;            translateRadius = START_RADIUS;            invalidate();        }        return true;    }

After the touch flag is set to true, call invalidate to force re-painting. onDraw is called. At this time, the onDraw function should be written as follows:

@ Override protected void onDraw (Canvas canvas) {super. onDraw (canvas); if (touched) {Paint p = new Paint (); p. setStyle (Paint. style. FILL); p. setColor (skillColor); p. setStrokeWidth (1); p. setAlpha (ringAlpha); int w = canvas. getClipBounds (). width (); // get the int c = w/2; // calculate the center point int inner = Math. round (c-this. ringWidth-translateRadius); // you can specify the inner radius of the canvas. drawCircle (c, c, inner, p); translateRadius-= ANIMATE_SPEED; ringAlpha-= ANIMATE_SPEED * 5; if (inner> = UI_WIDTH/2 | ringAlpha <= 0) {touched = false; Intent toSkill = new Intent (context, SkillActivity. class); toSkill. putExtra ("id", id); context. startActivity (toSkill);} postInvalidateDelayed (20 );}}

We keep drawing this aperture (or circle) until the transparency of the aperture turns transparent or the aperture spreads to invisible places. PostInvalidateDelayed is used to control the animation playback speed and reduce the frame rate. After doing this, we can complete the animation of the custom control. Although animation is a pediatrics, you can learn the animation method. In fact, there are still many ways to generate custom control animation. If you are interested, you can check it, the most beautiful custom control and custom control animation I have ever seen is Timely. Its digital animation and background color transition are almost fascinating and I will not give it a link, if you are interested, you can go to Baidu to install it. However, it seems that you need Android 4.2 + or 4.0 +, if you cannot install it, you can watch the Publicity Video (Google Android Design mentioned this application twice ).
Really. I ended with four blog posts and wrote my android resume. Actually, I have used this resume, but the effect can only be said: Haha. The company I want to go to still didn't even give me a written test. I showed my android resume. hr just gave me a perfunctory look and clicked on it. To be honest, I feel a little depressed, but I am still very grateful for this android resume. I did not expect the first blog post to be recommended to the homepage, nor was it very touched by the encouragement of so many people. It doesn't matter if you don't enter that company. I have no way to screen your resume from a school. I can only silently improve my strength. My interest will certainly not be overwhelmed by this small matter. I will do more practices, and I will do enough for J2EE projects. Next I will do Android and Hadoop, and I will never be afraid to learn new technologies, learning new technologies will make me very excited. Since my freshman year, I have enjoyed this kind of problem solving experience. It may be a sense of accomplishment that gives me the motivation to continue learning. Well, that's all you need. I hope I can write better articles later ~