> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-v6-beta2-flutter-uikit.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Button Click Listener

Intercept UI button clicks with `ButtonClickListener`. This listener provides callbacks when users tap buttons in the call UI, allowing you to implement custom behavior or show confirmation dialogs.

## Prerequisites

* An active [call session](/calls/android/join-session)
* Access to the `CallSession` instance

## Register Listener

Register a `ButtonClickListener` to receive button click callbacks:

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    val callSession = CallSession.getInstance()

    callSession.addButtonClickListener(this, object : ButtonClickListener() {
        override fun onLeaveSessionButtonClicked() {
            Log.d(TAG, "Leave button clicked")
        }

        override fun onToggleAudioButtonClicked() {
            Log.d(TAG, "Audio toggle button clicked")
        }

        override fun onToggleVideoButtonClicked() {
            Log.d(TAG, "Video toggle button clicked")
        }

        // Additional callbacks...
    })
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    CallSession callSession = CallSession.getInstance();

    callSession.addButtonClickListener(this, new ButtonClickListener() {
        @Override
        public void onLeaveSessionButtonClicked() {
            Log.d(TAG, "Leave button clicked");
        }

        @Override
        public void onToggleAudioButtonClicked() {
            Log.d(TAG, "Audio toggle button clicked");
        }

        @Override
        public void onToggleVideoButtonClicked() {
            Log.d(TAG, "Video toggle button clicked");
        }

        // Additional callbacks...
    });
    ```
  </Tab>
</Tabs>

<Note>
  The listener is automatically removed when the `LifecycleOwner` (Activity/Fragment) is destroyed, preventing memory leaks.
</Note>

***

## Callbacks

### onLeaveSessionButtonClicked

Triggered when the user taps the leave session button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onLeaveSessionButtonClicked() {
        Log.d(TAG, "Leave button clicked")
        // Show confirmation dialog before leaving
        showLeaveConfirmationDialog()
    }

    private fun showLeaveConfirmationDialog() {
        AlertDialog.Builder(this)
            .setTitle("Leave Call")
            .setMessage("Are you sure you want to leave this call?")
            .setPositiveButton("Leave") { _, _ ->
                callSession.leaveSession()
            }
            .setNegativeButton("Cancel", null)
            .show()
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onLeaveSessionButtonClicked() {
        Log.d(TAG, "Leave button clicked");
        // Show confirmation dialog before leaving
        showLeaveConfirmationDialog();
    }

    private void showLeaveConfirmationDialog() {
        new AlertDialog.Builder(this)
            .setTitle("Leave Call")
            .setMessage("Are you sure you want to leave this call?")
            .setPositiveButton("Leave", (dialog, which) -> {
                callSession.leaveSession();
            })
            .setNegativeButton("Cancel", null)
            .show();
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Show confirmation dialog before leaving
* Log analytics event
* Perform cleanup before leaving

***

### onToggleAudioButtonClicked

Triggered when the user taps the audio mute/unmute button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onToggleAudioButtonClicked() {
        Log.d(TAG, "Audio toggle clicked")
        // Track audio toggle analytics
        analytics.logEvent("audio_toggled")
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onToggleAudioButtonClicked() {
        Log.d(TAG, "Audio toggle clicked");
        // Track audio toggle analytics
        analytics.logEvent("audio_toggled");
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Log analytics events
* Show tooltip on first use
* Implement custom audio toggle logic

***

### onToggleVideoButtonClicked

Triggered when the user taps the video on/off button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onToggleVideoButtonClicked() {
        Log.d(TAG, "Video toggle clicked")
        // Track video toggle analytics
        analytics.logEvent("video_toggled")
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onToggleVideoButtonClicked() {
        Log.d(TAG, "Video toggle clicked");
        // Track video toggle analytics
        analytics.logEvent("video_toggled");
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Log analytics events
* Check camera permissions
* Implement custom video toggle logic

***

### onSwitchCameraButtonClicked

Triggered when the user taps the switch camera button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onSwitchCameraButtonClicked() {
        Log.d(TAG, "Switch camera clicked")
        // Track camera switch analytics
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onSwitchCameraButtonClicked() {
        Log.d(TAG, "Switch camera clicked");
        // Track camera switch analytics
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Log analytics events
* Show camera switching animation
* Track front/back camera usage

***

### onRaiseHandButtonClicked

Triggered when the user taps the raise hand button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onRaiseHandButtonClicked() {
        Log.d(TAG, "Raise hand clicked")
        // Show hand raised confirmation
        Toast.makeText(this, "Hand raised", Toast.LENGTH_SHORT).show()
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onRaiseHandButtonClicked() {
        Log.d(TAG, "Raise hand clicked");
        // Show hand raised confirmation
        Toast.makeText(this, "Hand raised", Toast.LENGTH_SHORT).show();
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Show confirmation feedback
* Log analytics events
* Implement custom hand raise behavior

***

### onShareInviteButtonClicked

Triggered when the user taps the share invite button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onShareInviteButtonClicked() {
        Log.d(TAG, "Share invite clicked")
        // Show custom share dialog
        showShareDialog()
    }

    private fun showShareDialog() {
        val shareIntent = Intent(Intent.ACTION_SEND).apply {
            type = "text/plain"
            putExtra(Intent.EXTRA_TEXT, "Join my call: https://example.com/call/$sessionId")
        }
        startActivity(Intent.createChooser(shareIntent, "Share call link"))
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onShareInviteButtonClicked() {
        Log.d(TAG, "Share invite clicked");
        // Show custom share dialog
        showShareDialog();
    }

    private void showShareDialog() {
        Intent shareIntent = new Intent(Intent.ACTION_SEND);
        shareIntent.setType("text/plain");
        shareIntent.putExtra(Intent.EXTRA_TEXT, "Join my call: https://example.com/call/" + sessionId);
        startActivity(Intent.createChooser(shareIntent, "Share call link"));
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Show custom share sheet
* Generate and share invite link
* Copy link to clipboard

***

### onChangeLayoutButtonClicked

Triggered when the user taps the change layout button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onChangeLayoutButtonClicked() {
        Log.d(TAG, "Change layout clicked")
        // Show layout options dialog
        showLayoutOptionsDialog()
    }

    private fun showLayoutOptionsDialog() {
        val layouts = arrayOf("Tile", "Spotlight")
        AlertDialog.Builder(this)
            .setTitle("Select Layout")
            .setItems(layouts) { _, which ->
                val layoutType = if (which == 0) LayoutType.TILE else LayoutType.SPOTLIGHT
                callSession.setLayout(layoutType)
            }
            .show()
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onChangeLayoutButtonClicked() {
        Log.d(TAG, "Change layout clicked");
        // Show layout options dialog
        showLayoutOptionsDialog();
    }

    private void showLayoutOptionsDialog() {
        String[] layouts = {"Tile", "Spotlight"};
        new AlertDialog.Builder(this)
            .setTitle("Select Layout")
            .setItems(layouts, (dialog, which) -> {
                LayoutType layoutType = (which == 0) ? LayoutType.TILE : LayoutType.SPOTLIGHT;
                callSession.setLayout(layoutType);
            })
            .show();
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Show custom layout picker
* Log layout change analytics
* Implement custom layout switching

***

### onParticipantListButtonClicked

Triggered when the user taps the participant list button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onParticipantListButtonClicked() {
        Log.d(TAG, "Participant list clicked")
        // Track participant list views
        analytics.logEvent("participant_list_opened")
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onParticipantListButtonClicked() {
        Log.d(TAG, "Participant list clicked");
        // Track participant list views
        analytics.logEvent("participant_list_opened");
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Log analytics events
* Show custom participant list UI
* Track feature usage

***

### onChatButtonClicked

Triggered when the user taps the chat button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onChatButtonClicked() {
        Log.d(TAG, "Chat button clicked")
        // Open custom chat UI
        openChatScreen()
    }

    private fun openChatScreen() {
        // Navigate to chat screen or show chat overlay
        val intent = Intent(this, ChatActivity::class.java)
        intent.putExtra("sessionId", sessionId)
        startActivity(intent)
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onChatButtonClicked() {
        Log.d(TAG, "Chat button clicked");
        // Open custom chat UI
        openChatScreen();
    }

    private void openChatScreen() {
        // Navigate to chat screen or show chat overlay
        Intent intent = new Intent(this, ChatActivity.class);
        intent.putExtra("sessionId", sessionId);
        startActivity(intent);
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Open custom chat interface
* Show in-call messaging overlay
* Navigate to chat screen

***

### onRecordingToggleButtonClicked

Triggered when the user taps the recording button.

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    override fun onRecordingToggleButtonClicked() {
        Log.d(TAG, "Recording toggle clicked")
        // Show recording consent dialog
        showRecordingConsentDialog()
    }

    private fun showRecordingConsentDialog() {
        AlertDialog.Builder(this)
            .setTitle("Start Recording")
            .setMessage("All participants will be notified that this call is being recorded.")
            .setPositiveButton("Start") { _, _ ->
                callSession.startRecording()
            }
            .setNegativeButton("Cancel", null)
            .show()
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    @Override
    public void onRecordingToggleButtonClicked() {
        Log.d(TAG, "Recording toggle clicked");
        // Show recording consent dialog
        showRecordingConsentDialog();
    }

    private void showRecordingConsentDialog() {
        new AlertDialog.Builder(this)
            .setTitle("Start Recording")
            .setMessage("All participants will be notified that this call is being recorded.")
            .setPositiveButton("Start", (dialog, which) -> {
                callSession.startRecording();
            })
            .setNegativeButton("Cancel", null)
            .show();
    }
    ```
  </Tab>
</Tabs>

**Use Cases:**

* Show recording consent dialog
* Check recording permissions
* Log recording analytics

***

## Complete Example

Here's a complete example handling all button click events:

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    class CallActivity : AppCompatActivity() {
        private lateinit var callSession: CallSession

        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_call)

            callSession = CallSession.getInstance()
            setupButtonClickListener()
        }

        private fun setupButtonClickListener() {
            callSession.addButtonClickListener(this, object : ButtonClickListener() {
                override fun onLeaveSessionButtonClicked() {
                    showLeaveConfirmationDialog()
                }

                override fun onToggleAudioButtonClicked() {
                    Log.d(TAG, "Audio toggle clicked")
                }

                override fun onToggleVideoButtonClicked() {
                    Log.d(TAG, "Video toggle clicked")
                }

                override fun onSwitchCameraButtonClicked() {
                    Log.d(TAG, "Switch camera clicked")
                }

                override fun onRaiseHandButtonClicked() {
                    Toast.makeText(
                        this@CallActivity,
                        "Hand raised",
                        Toast.LENGTH_SHORT
                    ).show()
                }

                override fun onShareInviteButtonClicked() {
                    shareCallLink()
                }

                override fun onChangeLayoutButtonClicked() {
                    showLayoutOptionsDialog()
                }

                override fun onParticipantListButtonClicked() {
                    Log.d(TAG, "Participant list opened")
                }

                override fun onChatButtonClicked() {
                    openChatScreen()
                }

                override fun onRecordingToggleButtonClicked() {
                    showRecordingConsentDialog()
                }
            })
        }

        private fun showLeaveConfirmationDialog() {
            AlertDialog.Builder(this)
                .setTitle("Leave Call")
                .setMessage("Are you sure you want to leave?")
                .setPositiveButton("Leave") { _, _ ->
                    callSession.leaveSession()
                }
                .setNegativeButton("Cancel", null)
                .show()
        }

        private fun shareCallLink() {
            val shareIntent = Intent(Intent.ACTION_SEND).apply {
                type = "text/plain"
                putExtra(Intent.EXTRA_TEXT, "Join my call!")
            }
            startActivity(Intent.createChooser(shareIntent, "Share"))
        }

        private fun showLayoutOptionsDialog() {
            val layouts = arrayOf("Tile", "Spotlight")
            AlertDialog.Builder(this)
                .setTitle("Select Layout")
                .setItems(layouts) { _, which ->
                    val layoutType = if (which == 0) LayoutType.TILE else LayoutType.SPOTLIGHT
                    callSession.setLayout(layoutType)
                }
                .show()
        }

        private fun openChatScreen() {
            // Open chat UI
        }

        private fun showRecordingConsentDialog() {
            AlertDialog.Builder(this)
                .setTitle("Start Recording")
                .setMessage("All participants will be notified.")
                .setPositiveButton("Start") { _, _ ->
                    callSession.startRecording()
                }
                .setNegativeButton("Cancel", null)
                .show()
        }

        companion object {
            private const val TAG = "CallActivity"
        }
    }
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    public class CallActivity extends AppCompatActivity {
        private static final String TAG = "CallActivity";
        private CallSession callSession;

        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_call);

            callSession = CallSession.getInstance();
            setupButtonClickListener();
        }

        private void setupButtonClickListener() {
            callSession.addButtonClickListener(this, new ButtonClickListener() {
                @Override
                public void onLeaveSessionButtonClicked() {
                    showLeaveConfirmationDialog();
                }

                @Override
                public void onToggleAudioButtonClicked() {
                    Log.d(TAG, "Audio toggle clicked");
                }

                @Override
                public void onToggleVideoButtonClicked() {
                    Log.d(TAG, "Video toggle clicked");
                }

                @Override
                public void onSwitchCameraButtonClicked() {
                    Log.d(TAG, "Switch camera clicked");
                }

                @Override
                public void onRaiseHandButtonClicked() {
                    Toast.makeText(
                        CallActivity.this,
                        "Hand raised",
                        Toast.LENGTH_SHORT
                    ).show();
                }

                @Override
                public void onShareInviteButtonClicked() {
                    shareCallLink();
                }

                @Override
                public void onChangeLayoutButtonClicked() {
                    showLayoutOptionsDialog();
                }

                @Override
                public void onParticipantListButtonClicked() {
                    Log.d(TAG, "Participant list opened");
                }

                @Override
                public void onChatButtonClicked() {
                    openChatScreen();
                }

                @Override
                public void onRecordingToggleButtonClicked() {
                    showRecordingConsentDialog();
                }
            });
        }

        private void showLeaveConfirmationDialog() {
            new AlertDialog.Builder(this)
                .setTitle("Leave Call")
                .setMessage("Are you sure you want to leave?")
                .setPositiveButton("Leave", (dialog, which) -> {
                    callSession.leaveSession();
                })
                .setNegativeButton("Cancel", null)
                .show();
        }

        private void shareCallLink() {
            Intent shareIntent = new Intent(Intent.ACTION_SEND);
            shareIntent.setType("text/plain");
            shareIntent.putExtra(Intent.EXTRA_TEXT, "Join my call!");
            startActivity(Intent.createChooser(shareIntent, "Share"));
        }

        private void showLayoutOptionsDialog() {
            String[] layouts = {"Tile", "Spotlight"};
            new AlertDialog.Builder(this)
                .setTitle("Select Layout")
                .setItems(layouts, (dialog, which) -> {
                    LayoutType layoutType = (which == 0) ? LayoutType.TILE : LayoutType.SPOTLIGHT;
                    callSession.setLayout(layoutType);
                })
                .show();
        }

        private void openChatScreen() {
            // Open chat UI
        }

        private void showRecordingConsentDialog() {
            new AlertDialog.Builder(this)
                .setTitle("Start Recording")
                .setMessage("All participants will be notified.")
                .setPositiveButton("Start", (dialog, which) -> {
                    callSession.startRecording();
                })
                .setNegativeButton("Cancel", null)
                .show();
        }
    }
    ```
  </Tab>
</Tabs>

***

## Callbacks Summary

| Callback                         | Description                         |
| -------------------------------- | ----------------------------------- |
| `onLeaveSessionButtonClicked`    | Leave session button was tapped     |
| `onToggleAudioButtonClicked`     | Audio mute/unmute button was tapped |
| `onToggleVideoButtonClicked`     | Video on/off button was tapped      |
| `onSwitchCameraButtonClicked`    | Switch camera button was tapped     |
| `onRaiseHandButtonClicked`       | Raise hand button was tapped        |
| `onShareInviteButtonClicked`     | Share invite button was tapped      |
| `onChangeLayoutButtonClicked`    | Change layout button was tapped     |
| `onParticipantListButtonClicked` | Participant list button was tapped  |
| `onChatButtonClicked`            | Chat button was tapped              |
| `onRecordingToggleButtonClicked` | Recording toggle button was tapped  |

## Hide Buttons

You can hide specific buttons using [SessionSettings](/calls/android/session-settings):

<Tabs>
  <Tab title="Kotlin">
    ```kotlin theme={null}
    val sessionSettings = CometChatCalls.SessionSettingsBuilder()
        .hideLeaveSessionButton(false)
        .hideToggleAudioButton(false)
        .hideToggleVideoButton(false)
        .hideSwitchCameraButton(false)
        .hideRaiseHandButton(false)
        .hideShareInviteButton(true)
        .hideChangeLayoutButton(false)
        .hideParticipantListButton(false)
        .hideChatButton(true)
        .hideRecordingButton(true)
        .build()
    ```
  </Tab>

  <Tab title="Java">
    ```java theme={null}
    SessionSettings sessionSettings = new CometChatCalls.SessionSettingsBuilder()
        .hideLeaveSessionButton(false)
        .hideToggleAudioButton(false)
        .hideToggleVideoButton(false)
        .hideSwitchCameraButton(false)
        .hideRaiseHandButton(false)
        .hideShareInviteButton(true)
        .hideChangeLayoutButton(false)
        .hideParticipantListButton(false)
        .hideChatButton(true)
        .hideRecordingButton(true)
        .build();
    ```
  </Tab>
</Tabs>

## Next Steps

<CardGroup cols={2}>
  <Card title="Layout Listener" icon="table-cells" href="/calls/android/layout-listener">
    Handle layout change events
  </Card>

  <Card title="Session Settings" icon="gear" href="/calls/android/session-settings">
    Configure button visibility
  </Card>
</CardGroup>
