เพียงดาวน์โหลดแพ็คเกจจากที่นี่ และเพิ่มลงใน classpath โปรเจ็กต์ของคุณ หรือใช้ maven repo:
เกรด:
implementation ' com.ramotion.circlemenu:circle-menu:0.3.2 '
เสาร์:
libraryDependencies += " com.ramotion.circlemenu " % " circle-menu " % " 0.3.2 "
มาเวน:
< dependency >
< groupId >com.ramotion.circlemenu</ groupId >
< artifactId >circle-menu</ artifactId >
< version >0.3.2</ version >
</ dependency >
วาง CircleMenuView
ในเค้าโครงของคุณและตั้งค่าไอคอนและสีของปุ่มต่างๆ ดังที่แสดงด้านล่าง
app:button_colors="@array/colors"
app:button_icons="@array/icons"
ตัวอย่าง colors
และ icons
ของอาร์เรย์ใน resvaluesbuttons.xml
:
<? xml version = " 1.0 " encoding = " utf-8 " ?>
< resources >
< array name = " icons " >
< item >@drawable/ic_home_white_24dp</ item >
< item >@drawable/ic_search_white_24dp</ item >
< item >@drawable/ic_notifications_white_24dp</ item >
< item >@drawable/ic_settings_white_24dp</ item >
< item >@drawable/ic_place_white_24dp</ item >
</ array >
< array name = " colors " >
< item >@android:color/holo_blue_light</ item >
< item >@android:color/holo_green_dark</ item >
< item >@android:color/holo_red_light</ item >
< item >@android:color/holo_purple</ item >
< item >@android:color/holo_orange_light</ item >
</ array >
</ resources >
หรือใช้ตัวสร้าง
CircleMenuView ( @ NonNull Context context , @ NonNull List < Integer > icons , @ NonNull List < Integer > colors )
เพื่อเพิ่ม CircleMenuView
และกำหนดค่าปุ่มโดยทางโปรแกรม (ในโค้ด)
ถัดไป เชื่อมต่อตัวจัดการเหตุการณ์ CircleMenuView.EventListener
ดังที่แสดงด้านล่าง และแทนที่วิธีการที่คุณต้องการ
final CircleMenuView menu = ( CircleMenuView ) findViewById ( R . id . circle_menu );
menu . setEventListener ( new CircleMenuView . EventListener () {
@ Override
public void onMenuOpenAnimationStart ( @ NonNull CircleMenuView view ) {
Log . d ( "D" , "onMenuOpenAnimationStart" );
}
@ Override
public void onMenuOpenAnimationEnd ( @ NonNull CircleMenuView view ) {
Log . d ( "D" , "onMenuOpenAnimationEnd" );
}
@ Override
public void onMenuCloseAnimationStart ( @ NonNull CircleMenuView view ) {
Log . d ( "D" , "onMenuCloseAnimationStart" );
}
@ Override
public void onMenuCloseAnimationEnd ( @ NonNull CircleMenuView view ) {
Log . d ( "D" , "onMenuCloseAnimationEnd" );
}
@ Override
public void onButtonClickAnimationStart ( @ NonNull CircleMenuView view , int index ) {
Log . d ( "D" , "onButtonClickAnimationStart| index: " + index );
}
@ Override
public void onButtonClickAnimationEnd ( @ NonNull CircleMenuView view , int index ) {
Log . d ( "D" , "onButtonClickAnimationEnd| index: " + index );
}
});
คุณสามารถใช้เมธอด open(boolean animate)
และ close(boolean animate)
เพื่อเปิดและปิดเมนูโดยทางโปรแกรม
นี่คือแอตทริบิวต์ที่คุณสามารถระบุผ่าน XML หรือตัวตั้งค่าที่เกี่ยวข้อง:
button_icons
- อาร์เรย์ของไอคอนปุ่มbutton_colors
- อาร์เรย์ของสีของปุ่มicon_menu
- ไอคอนเริ่มต้นของเมนูicon_close
- ไอคอนปิดเมนูicon_color
- สีไอคอนเมนูduration_ring
- ระยะเวลาเอฟเฟกต์วงแหวนduration_open
- ระยะเวลาภาพเคลื่อนไหวการเปิดเมนูduration_close
- ระยะเวลาภาพเคลื่อนไหวการปิดเมนูdistance
- ระยะห่างระหว่างปุ่มกลางและปุ่มต่างๆ Circle Menu Android เปิดตัวภายใต้ใบอนุญาต MIT ดูใบอนุญาตสำหรับรายละเอียด
ไลบรารีนี้เป็นส่วนหนึ่งของ โครงการโอเพ่นซอร์ส UI ที่ดีที่สุดของเรา
หากคุณใช้ไลบรารีโอเพ่นซอร์สในโครงการของคุณ โปรดตรวจสอบให้แน่ใจว่าได้ให้เครดิตและลิงก์ย้อนกลับไปที่ www.ramotion.com
ลองใช้องค์ประกอบ UI นี้และอื่นๆ ที่คล้ายกันในแอป Android ของเรา ติดต่อเราหากสนใจ