CODEWITHSUNDEEP
androidmenutooltip
rweiser
rweiser

Reputation: 329

Tooltip on short click on Android MenuItem

We use a few tooltips throughout our Android app, configured simply with view.setToolTipText(string). However, since we want the tooltips to display on a short/regular click, rather than a long click, we add:

view.setOnClickListener(View::performLongClick);

We are now adding a menu item (as in, an <item> within a <menu> in a menu XML file) that we'd like to have a tooltip. It has no other functionality when clicked - it is intended to display status, first as an icon, and then with more information in the tooltip. But while MenuItem does have a setOnMenuItemClickListener method, it does not seem to have a corresponding method for performLongClick.

Any way to get our tooltip showing with a short/regular click rather than a long click?

Upvotes: 0

Views: 92

Answers (1)

Atrideistria l
Atrideistria l

Reputation: 21

In your setOnMenuItemClickListener () in the implementation,for example

 override fun onCreateOptionsMenu(menu: Menu): Boolean {
       menuInflater.inflate(R.menu.your_menu, menu)
       val infoItem = menu.findItem(R.id.action_info)

       TooltipCompat.setTooltipText(infoItem, "This is a status message")

       infoItem.setOnMenuItemClickListener {
           TooltipCompat.showTooltip(it)
           true
       }

       return true
   }

Another way is to use a custom popview, which is more flexible

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:orientation="vertical"
   android:background="@drawable/tooltip_background"
   android:padding="8dp">

   <TextView
       android:id="@+id/tooltip_text"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:textColor="@android:color/white"
       android:text="This is a status message" />

</LinearLayout>

Here you can pass in the setting parameters

infoItem.setOnMenuItemClickListener {
           showCustomTooltip(it, "This is a status message", 3000) //  
           true
       }

Concrete realization

   private fun showCustomTooltip(item: MenuItem, tooltipText: String, duration: Long) {
      
       val menuItemView = findViewById<View>(item.itemId)
       val view = menuItemView ?: View(this).apply {
           id = item.itemId
       }

       val popupWindow = PopupWindow(
           layoutInflater.inflate(R.layout.custom_tooltip_layout, null),
           ViewGroup.LayoutParams.WRAP_CONTENT,
           ViewGroup.LayoutParams.WRAP_CONTENT,
           true
       )

       // Set the content of the prompt
       val tooltipTextView = popupWindow.contentView.findViewById<TextView>(R.id.tooltip_text)
       tooltipTextView.text = tooltipText

       // Displays the tooltip next to the MenuItem
       val location = IntArray(2)
       view.getLocationOnScreen(location)
       val x = location[0] + view.width
       val y = location[1] + view.height / 2

       popupWindow.showAtLocation(view, Gravity.NO_GRAVITY, x, y)
       //Display duration
       Handler(Looper.getMainLooper()).postDelayed({
           popupWindow.dismiss()
       }, duration)
   }

Upvotes: 0

Related Questions