移动端的设备屏幕小，大家都费尽心思想在有限的空间中放入更多的东西，于是各种各样的菜单就出来了，一个小小的按钮中隐藏着数个功能，就问你怕不怕。谷歌官方在安卓中也给我们提供了相应的办法实现这个弹出式菜单功能，不过，大家都觉得官方的是最丑的，于是各种框架出现了。比如BasePopup框架、XPopup框架等，下面我们用实例见证下这个弹出式菜单长啥样吧。
先上图，照着这个做，官方模板：
安卓开发使用PopupMenu及第三方组件实现弹出式菜单
首先是菜单清单，main_menu.xml文件：
复制
<menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/menu1" android:title="menu1"/> <item android:id="@+id/menu2" android:title="menu2"/> </menu>
Activity中使用
复制
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
button.setOnClickListener { onMenuClick(it) }
custBtn.setOnClickListener {
startActivity(Intent(this@MainActivity, CustMenuActivity::class.java))
}
xPopupBtn.setOnClickListener {
startActivity(Intent(this@MainActivity, XPopupActivity::class.java))
}
basePopupBtn.setOnClickListener {
startActivity(Intent(this@MainActivity, BasePopupActivity::class.java))
}
}
private fun onMenuClick(view: View) {
val popup = PopupMenu(this, view)
popup.menuInflater.inflate(R.menu.main_menu, popup.menu)
popup.setOnMenuItemClickListener { onMenuItemClick(it) }
popup.show()
}
private fun onMenuItemClick(item: MenuItem): Boolean {
when (item.itemId) {
R.id.menu1 -> Toast.makeText(this, "menu1", Toast.LENGTH_SHORT).show()
R.id.menu2 -> Toast.makeText(this, "menu2", Toast.LENGTH_SHORT).show()
else -> {
}
}
return false
}
}按照官方惯例，你可以使用xml文件为其配置样式效果。
第三方组件XPopup
开源地址：https://github.com/li-xiaojun/XPopup
添加依赖：
复制
implementation 'com.lxj:xpopup:1.6.2'
简单使用
复制
XPopup.Builder(this)
.atView(it) // 依附于所点击的View，内部会自动判断在上方或者下方显示
.asAttachList(arrayOf("Share", "Edit"),
null
) { position, text -> Toast.makeText(this, "clicked pos:$position", Toast.LENGTH_SHORT).show() }
.show()比官方简单了好多，我等懒人必备！
第三方组件BasePopup
开源地址：https://github.com/razerdp/BasePopup
添加依赖：
复制
implementation 'com.github.razerdp:BasePopup:2.1.9'
新建菜单布局文件popup_menu_small.xml
复制
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="#FFFFFF" android:orientation="vertical"> <TextView android:id="@+id/tx_1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:padding="16dp" android:text="Item 1" android:textSize="14sp" /> <View android:layout_width="match_parent" android:layout_height="0.5dp" android:background="#6c6c6c" /> <TextView android:id="@+id/tx_2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:padding="16dp" android:text="Item 2" android:textSize="14sp" /> <View android:layout_width="match_parent" android:layout_height="0.5dp" android:background="#6c6c6c" /> <TextView android:id="@+id/tx_3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:padding="16dp" android:text="Item 3" android:textSize="14sp" /> </LinearLayout>
简单调用：
复制
QuickPopupBuilder.with(this)
.contentView(R.layout.popup_menu_small)
.config(QuickPopupConfig()
.clipChildren(true)
.backgroundColor(Color.parseColor("#8C617D8A"))
.withClick(R.id.tx_1, { Toast.makeText(this, "tx1", Toast.LENGTH_SHORT).show() }, true)
.withClick(R.id.tx_2, { Toast.makeText(this, "tx2", Toast.LENGTH_SHORT).show() }, true)
.withClick(R.id.tx_3, { Toast.makeText(this, "tx3", Toast.LENGTH_SHORT).show() }, true)
)
.show(button)总结下：XPopup方式最简单，我很喜欢，谷歌官方比较繁琐，比较单调，BasePopup方式最强大，可玩性很强，效果也最好，相比于XPopup方式而已使用比较复杂，但还能接受。
评论 （0）