Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-27859] Android: Add "badge" support to TabGroup

GitHub Issuen/a
TypeImprovement
PriorityMedium
StatusClosed
ResolutionFixed
Resolution Date2020-11-25T15:11:23.000+0000
Affected Version/sn/a
Fix Version/sRelease 9.3.0
ComponentsAndroid
LabelsTabGroup, android, badge, parity, tab
ReporterJoshua Quick
AssigneeJoshua Quick
Created2020-04-21T17:29:12.000+0000
Updated2020-11-25T15:11:23.000+0000

Description

*Summary:* We currently only support displaying badges in TabGroup tabs on iOS. We should add support to Android for parity. https://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Tab-property-badge https://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.Tab-property-badgeColor *To-Do:* For the top tab style, we can use the "material" TabLayout.Tab class' getOrCreateBadge() and removeBadge() APIs. https://developer.android.com/reference/com/google/android/material/tabs/TabLayout.Tab For the bottom tab style, we can use the "material" BottomNavigationView class' getOrCreateBadge() and removeBadge() APIs. https://developer.android.com/reference/com/google/android/material/bottomnavigation/BottomNavigationView Both of the above tab classes use the "material" BadgeDrawable class which provides APIs such as setNumber(), setBackgroundColor(), etc. https://developer.android.com/reference/com/google/android/material/badge/BadgeDrawable

Comments

  1. Michael Gangolf 2020-04-26

  2. Joshua Quick 2020-04-29

    [~michael], will the badges not render correctly without the material theme? Is it a layout issue? Color issue? _*Side Note:*_ _Switching Titanium to use the material theme by default seemed like a breaking-change. So, we've punted on it for the moment. We'll probably look into it again for Titanium 10.0.0._
  3. Michael Gangolf 2020-04-29

    the app will crash with:
       [ERROR] TiExceptionHandler: (main) [356,787] Unable to start activity ComponentInfo{com.bottom/org.appcelerator.titanium.TiActivity}: java.lang.IllegalArgumentException: The style on this component requires your app theme to be Theme.MaterialComponents (or a descendant).
       [ERROR] TiExceptionHandler:
       [ERROR] TiExceptionHandler:     com.google.android.material.internal.ThemeEnforcement.checkTheme(ThemeEnforcement.java:248)
       [ERROR] TiExceptionHandler:     com.google.android.material.internal.ThemeEnforcement.checkMaterialTheme(ThemeEnforcement.java:222)
       [ERROR] TiExceptionHandler:     com.google.android.material.badge.BadgeDrawable.<init>(BadgeDrawable.java:361)
       [ERROR] TiExceptionHandler:     com.google.android.material.badge.BadgeDrawable.createFromAttributes(BadgeDrawable.java:294)
       [ERROR] TiExceptionHandler:     com.google.android.material.badge.BadgeDrawable.create(BadgeDrawable.java:262)
       [ERROR] TiExceptionHandler:     com.google.android.material.bottomnavigation.BottomNavigationMenuView.getOrCreateBadge(BottomNavigationMenuView.java:647)
       [ERROR] TiExceptionHandler:     com.google.android.material.bottomnavigation.BottomNavigationView.getOrCreateBadge(BottomNavigationView.java:674)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.widget.tabgroup.TiUIBottomNavigationTabGroup.updateBadge(TiUIBottomNavigationTabGroup.java:287)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.widget.tabgroup.TiUIBottomNavigationTabGroup.updateDrawablesAfterNewItem(TiUIBottomNavigationTabGroup.java:188)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.widget.tabgroup.TiUIBottomNavigationTabGroup.addTabItemInController(TiUIBottomNavigationTabGroup.java:170)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.widget.tabgroup.TiUIAbstractTabGroup.addTab(TiUIAbstractTabGroup.java:247)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.widget.tabgroup.TiUIBottomNavigationTabGroup.addTab(TiUIBottomNavigationTabGroup.java:64)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.TabGroupProxy.handlePostOpen(TabGroupProxy.java:480)
       [ERROR] TiExceptionHandler:     ti.modules.titanium.ui.TabGroupProxy.onWindowActivityCreated(TabGroupProxy.java:462)
       [ERROR] TiExceptionHandler:     org.appcelerator.titanium.TiBaseActivity.onCreate(TiBaseActivity.java:747)
       [ERROR] TiExceptionHandler:     org.appcelerator.titanium.TiActivity.onCreate(TiActivity.java:47)
       [ERROR] TiExceptionHandler:     android.app.Activity.performCreate(Activity.java:7825)
       [ERROR] TiExceptionHandler:     android.app.Activity.performCreate(Activity.java:7814)
       [ERROR] TiExceptionHandler:     android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1306)
       [ERROR] TiExceptionHandler:     android.app.ActivityThread.performLaunchActivity(ActivityThread.java:3245)
       [ERROR] TiExceptionHandler:     android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3409)
       [ERROR] TiExceptionHandler:     android.app.servertransaction.LaunchActivityItem.execute(LaunchActivityItem.java:83)
       [ERROR] TiExceptionHandler:     android.app.servertransaction.TransactionExecutor.executeCallbacks(TransactionExecutor.java:135)
       [ERROR] TiExceptionHandler:     android.app.servertransaction.TransactionExecutor.execute(TransactionExecutor.java:95)
       [ERROR] TiExceptionHandler:     android.app.ActivityThread$H.handleMessage(ActivityThread.java:2016)
       [ERROR] TiExceptionHandler:     android.os.Handler.dispatchMessage(Handler.java:107)
       [ERROR] TiExceptionHandler:     android.os.Looper.loop(Looper.java:214)
       [ERROR] TiExceptionHandler:     android.app.ActivityThread.main(ActivityThread.java:7356)
       [ERROR] TiExceptionHandler:     java.lang.reflect.Method.invoke(Native Method)
       [ERROR] TiExceptionHandler:     com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
       [ERROR] TiExceptionHandler:     com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)
       
  4. Michael Gangolf 2020-04-29

    I've added the missing badgeColor
  5. Joshua Quick 2020-04-29

    Hmm... perhaps a good interim solution is to change Titanium's default theme from... Theme.AppCompat ...to Google's material "bridge" themes... https://github.com/material-components/material-components-android/blob/master/docs/getting-started.md#bridge-themes-bridge-themes https://material.io/develop/android/docs/getting-started/#bridge-themes I'll have to experiment with this on my end.
  6. Joshua Quick 2020-08-13

    [~michael], I'm working on switching Titanium's default theme from "Theme.AppCompat" to "Theme.MaterialComponents.Bridge" for 9.3.0 now. Google's Bridge theme derives from AppCompat and so far looks to be completely backward compatible... and it preserves the current color scheme which avoids breaking-changes. It's looking pretty positive so far. The only problem is app developers can replace the default app theme with their own. Most people usually make their own custom theme which derives from "Theme.AppCompat", which will cause a crash with any AndroidX widget that requires the material theme. Not sure what we can do other than to let it crash and tell people to change the parent theme.
  7. Samir Mohammed 2020-10-08

    FR Passed, Waiting on Jenkins build.
  8. Samir Mohammed 2020-11-25

    *Closing ticket*. Improvement verified in SDK version 9.3.0.v20201125050632. Test and other information can be found at: https://github.com/appcelerator/titanium_mobile/pull/11659

JSON Source