Android custom view to realize circular and semicircular menus

Not long ago, when I saw Hongyang's big round menu, I wanted to start imitating it, because it was so cool. Then I began to transform my round menu according to some ideas and analysis told me by others (ZW brother).

Article structure: 1 Function introduction and display; 2. Explanation of some codes; 3. Display and explain the UI effects that can be achieved. 4. The source code is attached.

1、 Function introduction and display

The first display is the original of this control. But we can use many techniques to achieve our business UI effect.

Here is the demo of this blog work and the linkage display of the third point. It can be seen that it is a circular menu, which has more requirements than the circular menu of Hongyang dada:

1. Only a semicircle turntable is needed for the exhibition.

2. They cannot rotate automatically at the specified angle (some mathematical calculations involving extension will be explained later).

3. Bind fragment.

4. A buffer angle, that is, we will fix several positions instead of any position. We need to design a possible angle to automatically help him choose.

2、 Code explanation:

Explain in combination with the actual use. Divided into: 1 Calling mode; 2. The onmeasure method of this control; 3. Function of onlayout method; 4. Use of this control event mechanism dispatchtouchevent; 5. Mathematical calculation - a buffer angle.

(1) Calling method: (the code is the effect code below the display area)

(2) Explanation of onmeasure method of this control: focus on iterative measurement

Onmeasure depth: the view is displayed on the screen after calculation and layout. This method is used to calculate the width and height of the custom view. This calculation process refers to the size given by the parent layout and its own characteristics. Of course, there are related dimensional measurement modes. Here is a good blog post: onmeasure understanding. In addition, I also set this method as a listening callback!! The method we designed below can be directly used to set the picture for the control: setmenuitemicons andtexts.

(3) Explanation of onlayout method: (the mathematical calculation and layout icon of the circle here can be seen around the position of the circle. Hongyang Da's recommendation is very clear. Of course, I will explain it slightly below)

The train of thought for Hongyang dada's calculation of small circle is given:

(4) This control uses the event mechanism dispatchtouchevent:

Motionevent event event mechanism: (I only use three of this control) the main event types are: action_ Down: indicates that the user starts touching. ACTION_ Move: indicates that the user is moving (finger or other). ACTION_ Up: indicates that the user raised his finger.

(5) Mathematical calculation - a buffer angle.

As for the details of other small methods, you can see the source code and have a detailed explanation.

Source portal: GitHub address: Android - customize the round and "semicircular" menu of view. You can like star or fork, thank you!

Well, the Android custom view circular and "semicircular" menus are finished. This blog is based on a careful study of Hongyang dada's circular menu blog, and makes further development and writes its own understanding here.

The above is the whole content of this article. I hope it will be helpful to your study, and I hope you can support programming tips.