使用CAShapeLayer和UIBezierPath畫一個自定義半圓弧button

通常我們使用系統自帶的UIButton時,一般都是Rect矩形形式的,或則美工給出一張半圓弧的按鈕,如圖爲一張半圓加三角形的按鈕,而此時,如果給按鈕添加點擊事件時,響應事件依然爲矩形區域,不符合我們的需求;

本文爲解決這樣的按鈕問題:

wKioL1TJj0rhkOpBAABwkNoAuzk068.jpg


如下圖:使用CAShapeLayer和UIBezierPath畫了一個button,這個按鈕由一個半圓弧和三角形構成,現在我們需要點擊黃顏色區域時,響應按鈕點擊事件,彈出對話框,其他白色區域,不響應點擊事件;

wKiom1TJjmmyQUdAAACSQujt7tc635.jpg


第一步:

如下圖,自定義一個類,CustomButton,繼承於UIControl;本人覺得,如果要寫一個自定義按鈕,不需要button中的其他控件時,繼承於UIControl比較好,如果按鈕佈局同系統UIButton,那麼繼承於UIButton比較好;

wKioL1TJkX3ybxJ_AABkVpYx7QU716.jpg


第二步:

在CustomButton.m文件中,對CustomButton類添加一個延展,聲明三個成員變量;CAShapeLayer、id

、SEL;

wKiom1TJkJ6wGlF6AACOI8oO77M787.jpg


第三步:

在CustomButton.m文件中,做好自定義配置;其中,centerPoint爲半圓弧中心點,bottomPoint爲三角形頂尖點,endPoint爲圓弧起點和三角型左側相連的點,這個點可以去掉,去掉之後,圖形還是一樣的,只是沒有左側那條紅色的閉區間線條;

wKioL1TJkYqjtIh7AAT6z_XcPM4998.jpg

注意:[_target performSelectorOnMainThread:_action withObject:nil waitUntilDone:NO];調用者爲_target,不是self;不然會crash,原因爲定義的按鈕無法識別響應事件;


最後:在ViewController中,使用CustomButton定義一個按鈕,並調用相應的點擊事件;即可得到文章開始的效果

wKiom1TJkKrz0uipAALE8-7nG24406.jpg




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章