自定義View(英雄聯盟七星圖）之準備工作****

英雄聯盟七星圖建立模型二

• • • • 一、機關圓上的點的坐标
      • 二、平移變換
      • 三、繪制内接正七邊形
      • 四、擷取正N邊形每個點的坐标
      • 五、繪制View

上一篇文章記錄了一些最簡單直接的方法來建立模型，本篇就來講一下如何動态建立此模型，以後無論幾邊形我們都可以以此來解決，廢話不多說直接開打！

一、機關圓上的點的坐标

1. 建立直角坐标系；
2. 以坐标系原點為圓心，作機關圓，r；
3. 在第一象限取點A；

   

   由此可以得出A的坐标為： ( rcosθ , rsinθ )

二、平移變換

哈哈，搞定好像是國中或高中的某個知識點

1. 在上面的基礎上将圓沿着X軸方向移動Δx+r的距離；
2. 将圓沿着Y軸的方向移動Δy+r的距離，得到如下圖：
3. 其中綠色的直角坐标系為原來的坐标系；

由此可以得出A的坐标為： ( r • cosθ + r + Δx , r • sinθ + r + Δy )

三、繪制内接正七邊形

終于到了激動人心的時刻了，繪制圓的内接正七邊形

1. 由于android view坐标的Y軸正方向是朝下的，是以我們在此講正七邊形倒置繪制，這樣我們才能和android 坐标系對應起來；
2. 一般情況下我們在繪制多形圖時，都是取一個點作為定點，如圖中的C，以平行Y軸且過C點的直線作為多形圖的軸線對稱繪制，如圖所示；
3. 有多邊形的特性可得出： β = 2π / 7 , α = β - π/2 = - π/2 + β
4. 由于我們取C點特殊，是以得出：C （r + Δx ， Δy）即 ： [ r + Δx + r • cos( - π / 2 )，r +Δy + r • sin( - π / 2 ) ]

5. B點相當于點C繞點O逆時針旋轉 β 角 ，也就是 α = - π/2 + β

                            即 ：B [ r + Δx + r • cos( - π/2 + β ) ， r + Δy + r • sin( - π/2 + β ) ]

                            即 ：B [ r + Δx + r • cos( - π/2 + 1 • β ) ， r + Δy + r • sin( - π/2 + 1 • β ) ]

6. 是以正七邊形的七個坐标分别為（從C點開始）：

                   角 1 ： [ r + Δx + r • cos( - π/2 + 0 • β ) ， r + Δy + r • sin( - π/2 + 0 • β ) ]

                   角 2 ： [ r + Δx + r • cos( - π/2 + 1 • β ) ， r + Δy + r • sin( - π/2 + 1 • β ) ]

                   角 3 ： [ r + Δx + r • cos( - π/2 + 2 • β ) ， r + Δy + r • sin( - π/2 + 2 • β ) ]

                   角 4 ： [ r + Δx + r • cos( - π/2 + 3 • β ) ， r + Δy + r • sin( - π/2 + 3 • β ) ]

                   角 5 ： [ r + Δx + r • cos( - π/2 + 4 • β ) ， r + Δy + r • sin( - π/2 + 4 • β ) ]

                   角 6 ： [ r + Δx + r • cos( - π/2 + 5 • β ) ， r + Δy + r • sin( - π/2 + 5 • β ) ]

                   角 7 ： [ r + Δx + r • cos( - π/2 + 6 • β ) ， r + Δy + r • sin( - π/2 + 6 • β ) ]

四、擷取正N邊形每個點的坐标

由上可知我們可以得出正N邊形的個點坐标:

        令正n邊形的邊數為n 則 β = 2π / n

        是以正n邊形各個定點坐标為：

                角    1   ： [ r + Δx + r • cos( - π/2 + 0 • β ) ， r + Δy + r • sin( - π/2 + 0 • β ) ]

                角    2   ： [ r + Δx + r • cos( - π/2 + 1 • β ) ， r + Δy + r • sin( - π/2 + 1 • β ) ]

                角    3   ： [ r + Δx + r • cos( - π/2 + 2 • β ) ， r + Δy + r • sin( - π/2 + 2 • β ) ]

                角    4   ： [ r + Δx + r • cos( - π/2 + 3 • β ) ， r + Δy + r • sin( - π/2 + 3 • β ) ]

                角    5   ： [ r + Δx + r • cos( - π/2 + 4 • β ) ， r + Δy + r • sin( - π/2 + 4 • β ) ]

                                                                    • • • • • • •

                                                                    • • • • • • •

                                                                    • • • • • • •

                角 n - 1 ： { r + Δx + r • cos[ - π/2 + ( n - 2 ) • β ] ， r + Δy + r • sin[ - π/2 + ( n - 2 ) • β ] }

                角    n   ： { r + Δx + r • cos[ - π/2 + ( n - 1 ) • β ] ， r + Δy + r • sin[ - π/2 + ( n - 1 ) • β ] }

五、繪制View

兩種計算七星圖定點的坐标方法就算是講完了，這樣就可以開始我們的編碼子產品了，接下來我們将會使用這種動态的方式來計算繪制我們的七邊形，在下一篇文章中我們将會進行編碼子產品，謝謝大家！