Skip to main content

Screen: LMFeedTopicSelectionFragment

The LMFeedTopicSelectionFragment allows users to select topics of interest. It features a customizable header, a list of topics, and a search bar to filter topics. Users can submit their selected topics using a floating action button (FAB).

GitHub Link to LMFeedTopicSelectionFragment

View Style: LMFeedTopicSelectionFragmentViewStyle​

The LMFeedTopicSelectionFragmentViewStyle defines the visual style and layout of the fragment. Below are the available customization fields:

Field NameDescriptionType
headerViewStyleStyle for the header of the topic selection screen.LMFeedHeaderViewStyle
topicItemStyleStyle for individual topic items.LMFeedTextStyle
noTopicsLayoutViewStyleStyle for the "no topics available" layout.LMFeedNoEntityLayoutViewStyle
submitSelectedTopicsFABStyleStyle for the floating action button used to submit topics.LMFeedFABStyle
topicSearchBarViewStyleStyle for the search bar used to filter topics.LMFeedSearchBarViewStyle
backgroundColorBackground color for the topic selection fragment.Int

GitHub Link to LMFeedTopicSelectionFragmentViewStyle

Customization Available in LMFeedTopicSelectionFragment​

Header and Layout Customizations​

  • customizeTopicSelectionHeaderView(headerViewTopicSelection: LMFeedHeaderView)
    Customizes the header view for the topic selection fragment.
  • customizeNoTopicsLayout(layoutNoTopics: LMFeedNoEntityLayoutView)
    Customizes the layout shown when no topics are available.
  • customizeSubmitTopicsFab(fabSubmitSelectedTopics: LMFeedFAB)
    Customizes the floating action button for submitting selected topics.
  • customizeSearchBar(searchBar: LMFeedSearchBarView)
    Customizes the search bar for filtering topics.

Interactions Available in LMFeedTopicSelectionFragment​

General Interactions​

  • onSearchIconClicked()
    Triggered when the search icon is clicked.
  • onNavigationIconClicked()
    Triggered when the navigation icon in the header is clicked.
  • onSubmitFABClicked()
    Triggered when the floating action button for submitting topics is clicked.

Usage Example​

In this example, we're customizing the following elements of the topic selection screen:

  • Header View Appearance: Change the title.
  • Click Listeners: Override behavior for search icon click.

Steps to customize​

Step 1: Create CustomTopicSelectionFragment​

Start by extending LMFeedTopicSelectionFragment and create a custom class, say CustomTopicSelectionFragment.

class CustomTopicSelectionFragment : LMFeedTopicSelectionFragment() {
    // We will override methods in the next step
}

Step 2: Override and Customize Methods​

You can customize various aspects of the topic selection screen by overriding specific functions.

note

If you're providing your own custom layout or binding, you must override all lifecycle functions, especially:

  • onCreateView
  • onViewCreated
  • onResume
  • onPause
  • onDestroyView
class CustomTopicSelectionFragment : LMFeedTopicSelectionFragment() {

  override fun customizeTopicSelectionHeaderView(headerViewTopicSelection: LMFeedHeaderView) {
    super.customizeTopicSelectionHeaderView(headerViewTopicSelection)

    headerViewTopicSelection.setTitleText("Custom Title")
  }

  override fun onSearchIconClicked() {
    super.onSearchIconClicked()

    // Write your logic
  }
}

Step 3: Pass CustomTopicSelectionFragment for Navigation​

You now need to ensure that your fragment is returned wherever the topic selection screen is launched.

val application = this
val theme = LMFeedTheme.SOCIAL_FEED
val enablePushNotifications = false
val deviceId = null
val domain = "ENTER YOUR DOMAIN HERE"
val lmFeedCoreCallback = null

LMFeedCore.setup(
    application = application,
    theme,
    enablePushNotifications = enablePushNotifications,
    deviceId = deviceId,
    domain = domain,
    lmFeedCoreCallback = lmFeedCoreCallback
)

// Set your custom topic selection fragment here
LMFeedCore.setTopicSelectionFragment(CustomTopicSelectionFragment())