在 dribbble 上檢查這個項目
在 Behance 上查看該項目
對於有效的實現,請查看app
模組
將其新增至儲存庫末尾的根 build.gradle 中:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
新增依賴
dependencies {
implementation 'com.github.Yalantis:Context-Menu.Android:1.1.4'
}
MenuObject
列表,列表由圖示或圖示和描述組成。您可以使用任何drawable, resource, bitmap, color
作為圖像:
menuObject.drawable = ...
menuObject.setResourceValue(...)
menuObject.setBitmapValue(...)
menuObject.setColorValue(...)
您可以設定圖像ScaleType
:
menuObject.scaleType = ScaleType.FIT_XY
您可以使用任何resource, drawable, color
作為背景:
menuObject.setBgResourceValue(...)
menuObject.setBgDrawable(...)
menuObject.setBgColorValue(...)
現在您可以輕鬆地為選單標題新增文字外觀樣式:
In your project styles create style for text appearance
(For better visual effect extend it from TextView.DefaultStyle):
<style name="TextViewStyle" parent="TextView.DefaultStyle">
<item name="android:textStyle">italic|bold</item>
<item name="android:textColor">#26D0EB</item>
</style>
And set it's id to your MenuObject :
val bitmapDrawable = BitmapDrawable(
resources,
BitmapFactory.decodeResource(resources, R.drawable.icn_3)
)
val menuObject = MenuObject("Add to friends").apply {
drawable = bitmapDrawable
menuTextAppearanceStyle = R.style.TextViewStyle
}
您可以使用任何color
作為文字顏色:
menuObject.textColor = ...
您可以將任何color
設定為分隔線顏色:
menuObject.dividerColor = ...
例子:
val close = MenuObject().apply { setResourceValue(R.drawable.icn_close) }
val send = MenuObject("Send message").apply { setResourceValue(R.drawable.icn_1) }
val addFriend = MenuObject("Add to friends").apply {
drawable = BitmapDrawable(
resources,
BitmapFactory.decodeResource(resources, R.drawable.icn_3)
)
}
val menuObjects = mutableListOf<MenuObject>().apply {
add(close)
add(send)
add(addFriend)
}
ContextMenuDialogFragment
的newInstance
,它接收MenuParams
物件。 val menuParams = MenuParams(
actionBarSize = resources.getDimension(R.dimen.tool_bar_height).toInt(),
menuObjects = getMenuObjects(),
isClosableOutside = false
// set other settings to meet your needs
)
// If you want to change the side you need to add 'gravity' parameter,
// by default it is MenuGravity.END.
// For example:
val menuParams = MenuParams(
actionBarSize = resources.getDimension(R.dimen.tool_bar_height).toInt(),
menuObjects = getMenuObjects(),
isClosableOutside = false,
gravity = MenuGravity.START
)
val contextMenuDialogFragment = ContextMenuDialogFragment.newInstance(menuParams)
ContextMenuDialogFragment
。 override fun onCreateOptionsMenu(menu: Menu?): Boolean {
menuInflater.inflate(R.menu.menu_main, menu)
return true
}
override fun onOptionsItemSelected(item: MenuItem?): Boolean {
item?.let {
when (it.itemId) {
R.id.context_menu -> {
showContextMenuDialogFragment()
}
}
}
return super.onOptionsItemSelected(item)
}
contextMenuDialogFragment = menuItemClickListener = { view, position ->
// do something here
}
contextMenuDialogFragment = menuItemLongClickListener = { view, position ->
// do something here
}
為了獲得更好的體驗,選單項目的大小應等於ActionBar
高度。
ContextMenuDialogFragment
的newInstance
接收具有以下欄位的MenuParams
物件:
menuObjects
- MenuObject 物件列表,
animationDelay
- 在片段打開之後和關閉之前以毫秒為單位的延遲,這將使動畫在慢速設備上更加平滑,
animationDuration
- 每段動畫的持續時間(以毫秒為單位),
isClosableOutside
- 如果選單可以在觸摸非按鈕區域時關閉,
isFitSystemWindows
- 如果為 true,則會執行 fitSystemWindows(Rect) 的預設實現,
isClipToPadding
- true 將子項目剪輯到群組的填充,否則為 false。
如果您在主題中使用半透明參數,最後兩個參數可能會很有用:
<item name="android:windowTranslucentStatus">true</item>
若要將Context Menu
保留在狀態列下方,請將fitSystemWindows
設為 true,將clipToPadding
設為 false。
menuObject.textColor
的錯誤rtl
支援MenuParams
添加了gravity
參數setClosableOutside
問題。setAnimationDuration
不適用於開放事件的問題。Usage
中的區塊 5。ContextMenuDialogFragment
newInstance
方法已棄用。使用接收MenuParams
的新通用方法。MenuParams.setClosableOutside(boolean)
。MenuObject
建構函數。影像設定移至方法MenuObject
圖像、背景、文字顏色、分隔線顏色的樣式OnMenuItemLongClickListener
(用法:與OnMenuItemClickListener
相同,查看範例應用程式) com.yalantis.contextmenu.lib.ContextMenuDialogFragment.ItemClickListener ->
com.yalantis.contextmenu.lib.interfaces.OnMenuItemClickListener
com.yalantis.contextmenu.lib.ContextMenuDialogFragment.ItemClickListener.onItemClick(...) ->
com.yalantis.contextmenu.lib.interfaces.OnMenuItemClickListener.onMenuItemClick(...)
如果您向我們發送使用我們組件的項目的鏈接,我們將非常高興。只需發送電子郵件至 [email protected] 如果您對動畫有任何疑問或建議,請告訴我們。
PS 我們將發布更多包含在程式碼中的精彩內容以及關於如何讓 Android (iOS) 的 UI 變得更好的教學。敬請關注!
Copyright 2019, Yalantis
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.