Custom ViewGroup---draw discs

Source: Internet
Author: User

Let's talk a little bit of crap first.
I suddenly fell in love with work, not for anything else, but because work made me feel interesting.
Why do you want to do this disc, because our project needs to join the function of the big turntable,
But demand has changed, now the priority of the big turntable is not the highest. I'm here to record
If the project requires I will complete the completion.

Get ready:

Now there are features:
1. The color of the background changes depending on the dynamically loaded view.
2. Rotate according to the number of views and the initial angle change.
Expected to expand the project features:
1. According to the background of the movement of the number of pictures, changes and changes (in fact, has been achieved, we are dynamic add ImageView);
2. According to the background designated winning prizes, randomly simulate the angle of rotation to achieve a true rotation of the bright (this is only about business, not talk about other).
3. Can access the picture frame, make the picture can have a kind of fade in feeling.
42 Modes:
4.1 Click to turn on.

Let's talk about how the function is implemented.

If you do not know the view drawing process can look at my original blog, built on the view drawing process based on the written.
Ideas:
1-viewgoup how to draw the background.
2-viewgoup How to make Childview have a split disc bright.
3-viewgoup How to map dynamically add Childview size.
4-childeview according to what to rotate.

1.
I thought it was.
Draw method, 1. Draws the background-–>. 2 Draw Yourself (OnDraw)-–>3. Draw childview-->4. Drawing decorations
Now that you know the method, I'll call Viewgoup's OnDraw method to start drawing,
1. Let's just draw a rectangle and run it

 protected  void  onmeasure  (int  Widthmeasurespec, int  heightmeasurespec) {super.onmeasure (Widthmeasurespec, heightmeasurespec); mrange = new  RectF (  Getpaddingleft (), Getpaddingleft (), Layoutradius + getpaddingleft (), Layoutradius + getpaddingleft ()); }
@Override    protectedvoidonDraw(Canvas canvas) {  mArcPaint.setColor(mColors[0]);     true, mArcPaint);            }`

Running the simulator – The result is always a confusing feeling.

Workaround:
Called when initializing
Setwillnotdraw (FALSE);
Explain: If a view does not need to draw anything, then set this to true, the system will be optimized by default, by default view is not enabled by default should be true. If we know we need to draw, we can manually turn on this identity bit.

The effect was such that the moment of witnessing the miracle came,

    1. We certainly need to add the number and the circle there is a sense of split, then how do we do it

Let's give a picture here to explain.

Now don't want anything, listen to me finish first.
This circle should be the width and height measured by our view (take the smallest value to make the width of the view)
int val=math.min (width,height);
The center is (VAL/2,VAL/2); X=VAL/2, Y=VAL/2;
Radius r=val/2;
We're here to find the coordinates of Circle-1
Round -1_x=x+r*cos (45°), cos (45°) =0.707 .....
Round -1_y=y+r*sin (45°), sin (45°) =0.707 ....

If we ask for a value of 2, our first thought is to think about quadrant, right?
Here we need to convert the angle to the radian system.
Round -1_x=x+r*cos (135°); cos (135°) = 0.707
Round -1_y=y+r*sin (135°); sin (135°) =0.707 ....

So the formula is
Small round interval angle =360/count;
Offset angle =360°/CHILDCOUNT/2;
The first one:
angle=0+ offset angle;
The second one:
angle=0+ Small Circle interval angle + offset angle.
Do you see the rules?
angle= Small Circle interval angle *i+ offset angle;
x= Center _x+r*cos (angle);
y= Center _y+r*sin (angle);

This is the perfect solution to this problem of positioning.
--------------------------------
I guess someone here would like to know, how to locate it?
Explain it, it's all a step at a walk.
We're using viewgoup, so after it's positioned itself,
We need to onlayout its childeview position, of course, we calculate it by ourselves.

3-viewgoup How to map dynamically add Childview size.
The third problem is that we need to invoke the AddView (view) method of the API;
What's the use of calling it?
In simple terms, add child controls to Viewgoup.
Then recalculate the layout size, sub view position.
Here you can see in the source code

 Public void AddView(View Child,intIndex, Layoutparamsparams) {if(DBG) {System. out. println ( This+"AddView"); }if(Child = =NULL) {Throw NewIllegalArgumentException ("Cannot add a null child view to a ViewGroup"); }//Addviewinner () would call Child.requestlayout () when setting the new Layoutparams        //Therefore, we call Requestlayout () on ourselves before, so that's the child's request        // would be blocked at our level1. Requestlayout (); 2. Invalidate (true); Addviewinner (Child, Index,params,false); }

See the 1.2 of my logo?

Explanation of 1:
When view determines that it is no longer suitable for an existing zone, the view itself calls this method to require the parent view to re-invoke his onmeasure onlayout to reset his position.
Explanation of 2:
The view itself is called to force the view to repaint.
These two steps are executed, which means we can get them and then do the calculations on them.

4. Childeview according to what to rotate.

According to what to calculate, must be based on the angle to calculate the
Because I use ImageView and did not rotate to bitmap, so there is no use of the online said Matrix. Because I think it's more flexible to manipulate an object-like control (its own idea).
So a function view is used. Setrotation (angle);
Of course, this angle is angle, not radian.
Here again there is a calculation of the place, a bit of egg pain, but pain and happy.

Let's take a look at the picture first. No rotation before.

Have you ever thought of a good angle of rotation?
It's actually a regular thing.
In fact, from the above picture can be seen, all point to the top.
The following is a prototype diagram.

You can try this diagram to find out the pattern.
I'm just going to tell you the rules here.
Offset =360/CHILDE/2;
Rotation angle = Starting angle%360+ offset +90;
 
float n = startangle% + itemcenterpoint + 90;
  

   
  

Demo download

Reference:

Carry forward the great God custom turntable

Custom ViewGroup---draw discs

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.