Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(android): Fixes changing background colors for Tabs after they are drawn. (8_0_X) #10763

Merged
merged 4 commits into from
Mar 11, 2019
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@
@Kroll.proxy(creatableInModule = UIModule.class,
propertyAccessors = {
TiC.PROPERTY_TABS_BACKGROUND_COLOR,
TiC.PROPERTY_TABS_BACKGROUND_SELECTED_COLOR,
TiC.PROPERTY_SWIPEABLE,
TiC.PROPERTY_EXIT_ON_CLOSE,
TiC.PROPERTY_SMOOTH_SCROLL_ON_TAB_CLICK
Expand Down
13 changes: 12 additions & 1 deletion android/modules/ui/src/java/ti/modules/titanium/ui/TabProxy.java
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,10 @@
import org.appcelerator.titanium.TiC;
import org.appcelerator.titanium.proxy.TiViewProxy;
import org.appcelerator.titanium.proxy.TiWindowProxy;
import org.appcelerator.titanium.util.TiConvert;
import org.appcelerator.titanium.util.TiUIHelper;
import org.appcelerator.titanium.view.TiUIView;

import ti.modules.titanium.ui.widget.tabgroup.TiUIAbstractTabGroup;
import ti.modules.titanium.ui.widget.tabgroup.TiUITab;
import android.app.Activity;
// clang-format off
Expand Down Expand Up @@ -220,6 +220,17 @@ void onSelectionChanged(boolean selected)
((TiUITab) view).onSelectionChange(selected);
}

@Override
public void onPropertyChanged(String name, Object value)
{
super.onPropertyChanged(name, value);
if (name.equals(TiC.PROPERTY_BACKGROUND_COLOR) || name.equals(TiC.PROPERTY_BACKGROUND_FOCUSED_COLOR)) {
if (tabGroupProxy != null) {
((TiUIAbstractTabGroup) tabGroupProxy.getOrCreateView()).setDrawables();
}
}
}

@Override
public String getApiName()
{
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -82,9 +82,14 @@ public abstract class TiUIAbstractTabGroup extends TiUIView
/**
* Changes the controller's background color.
*
* @param drawable the new background drawable.
* @param colorInt the new background color.
*/
public abstract void setBackgroundDrawable(Drawable drawable);
public abstract void setBackgroundColor(int colorInt);

/**
* Changes the tabs background drawables to the proper color states.
*/
public abstract void setDrawables();

// region protected fields
protected static final String TAG = "TiUITabLayoutTabGroup";
Expand Down Expand Up @@ -346,6 +351,11 @@ public void processProperties(KrollDict d)
if (d.containsKey(TiC.PROPERTY_SMOOTH_SCROLL_ON_TAB_CLICK)) {
this.smoothScrollOnTabClick = d.getBoolean(TiC.PROPERTY_SMOOTH_SCROLL_ON_TAB_CLICK);
}
if (d.containsKeyAndNotNull(TiC.PROPERTY_TABS_BACKGROUND_COLOR)) {
setBackgroundColor(TiColorHelper.parseColor(d.get(TiC.PROPERTY_TABS_BACKGROUND_COLOR).toString()));
} else {
setBackgroundColor(this.colorPrimaryInt);
}
super.processProperties(d);
}

Expand All @@ -356,6 +366,11 @@ public void propertyChanged(String key, Object oldValue, Object newValue, KrollP
this.swipeable = TiConvert.toBoolean(newValue);
} else if (key.equals(TiC.PROPERTY_SMOOTH_SCROLL_ON_TAB_CLICK)) {
this.smoothScrollOnTabClick = TiConvert.toBoolean(newValue);
} else if (key.equals(TiC.PROPERTY_TABS_BACKGROUND_COLOR)) {
setDrawables();
setBackgroundColor(TiColorHelper.parseColor(newValue.toString()));
} else if (key.equals(TiC.PROPERTY_TABS_BACKGROUND_SELECTED_COLOR)) {
setDrawables();
} else {
super.propertyChanged(key, oldValue, newValue, proxy);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,9 @@
*/
package ti.modules.titanium.ui.widget.tabgroup;

import android.graphics.drawable.Drawable;
import android.content.res.ColorStateList;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.support.design.internal.BottomNavigationItemView;
import android.support.design.internal.BottomNavigationMenuView;
import android.support.design.widget.BottomNavigationView;
Expand Down Expand Up @@ -81,14 +82,6 @@ protected void onLayout(boolean hasChanged, int left, int top, int right, int bo
};
this.mBottomNavigationView.setFitsSystemWindows(true);

// Set the colorPrimary as backgroundColor by default if do not have the backgroundColor set.
if (proxy.hasPropertyAndNotNull(TiC.PROPERTY_TABS_BACKGROUND_COLOR)) {
this.mBottomNavigationView.setBackgroundColor(
TiColorHelper.parseColor(proxy.getProperty(TiC.PROPERTY_TABS_BACKGROUND_COLOR).toString()));
} else {
this.mBottomNavigationView.setBackgroundColor(this.colorPrimaryInt);
}

// Add tab bar and view pager to the root Titanium view.
// Note: If getFitsSystemWindows() returns false, then Titanium window's "extendSafeArea" is set true.
// This means the bottom tab bar should overlap/overlay the view pager content.
Expand Down Expand Up @@ -174,7 +167,7 @@ public void addTabItemInController(TabProxy tabProxy)
// Set the drawables.
setDrawables();
// Handle shift mode.
if (proxy.hasPropertyAndNotNull(TiC.PROPERTY_SHIFT_MODE)) {
if (this.proxy.hasPropertyAndNotNull(TiC.PROPERTY_SHIFT_MODE)) {
if (!((Boolean) proxy.getProperty(TiC.PROPERTY_SHIFT_MODE))) {
disableShiftMode();
}
Expand All @@ -186,7 +179,7 @@ public void addTabItemInController(TabProxy tabProxy)
* it rebuilds its menu on every addition of a new item in it.
*
*/
private void setDrawables()
public void setDrawables()
{
try {
ArrayList<TabProxy> tabs = ((TabGroupProxy) proxy).getTabList();
Expand Down Expand Up @@ -269,15 +262,10 @@ public void selectTabItemInController(int position)
((TabGroupProxy) getProxy()).onTabSelected(position);
}

/**
* Set the background drawable for BottomNavigationView.
*
* @param drawable the new background drawable.
*/
@Override
public void setBackgroundDrawable(Drawable drawable)
public void setBackgroundColor(int colorInt)
{
this.mBottomNavigationView.setBackground(drawable);
this.mBottomNavigationView.setBackgroundColor(colorInt);
}

/**
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,10 @@
import android.graphics.Rect;
import android.support.design.widget.TabLayout;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

import org.appcelerator.kroll.common.Log;
Expand Down Expand Up @@ -48,6 +48,40 @@ public TiUITabLayoutTabGroup(TabGroupProxy proxy, TiBaseActivity activity)
super(proxy, activity);
}

private void setDrawablesForTab(int tabIndex)
{
// Validate index input.
ArrayList<TabProxy> tabProxyArrayList = ((TabGroupProxy) this.proxy).getTabList();
if (tabIndex < 0 || tabIndex >= tabProxyArrayList.size()) {
return;
}

TabProxy tabProxy = tabProxyArrayList.get(tabIndex);
if (tabProxy == null) {
return;
}
// Create a background drawable with ripple effect for the state used by TabLayout.Tab.
Drawable backgroundDrawable = createBackgroundDrawableForState(tabProxy, android.R.attr.state_selected);

// Go through the layout to set the background color state drawable manually for each tab.
// Currently we support only the default type of TabLayout which has a SlidingTabStrip.
try {
LinearLayout stripLayout = ((LinearLayout) this.mTabLayout.getChildAt(0));
// Get the just added TabView as a LinearLayout in order to set the background.
LinearLayout tabLL = ((LinearLayout) stripLayout.getChildAt(tabIndex));
tabLL.setBackground(backgroundDrawable);
// Set the TextView textColor.
for (int i = 0; i < tabLL.getChildCount(); i++) {
if (tabLL.getChildAt(i) instanceof TextView) {
((TextView) tabLL.getChildAt(i))
.setTextColor(textColorStateList(tabProxy, android.R.attr.state_selected));
}
}
} catch (Exception e) {
Log.w(TAG, WARNING_LAYOUT_MESSAGE);
}
}

/**
* Removes the controller from the UI layout.
* @param disable
Expand Down Expand Up @@ -93,14 +127,6 @@ protected void onLayout(boolean hasChanged, int left, int top, int right, int bo
};
this.mTabLayout.setFitsSystemWindows(true);

// Set the colorPrimary as backgroundColor by default if do not have the backgroundColor set.
if (proxy.hasPropertyAndNotNull(TiC.PROPERTY_TABS_BACKGROUND_COLOR)) {
this.mTabLayout.setBackgroundColor(
TiColorHelper.parseColor(proxy.getProperty(TiC.PROPERTY_TABS_BACKGROUND_COLOR).toString()));
} else {
this.mTabLayout.setBackgroundColor(this.colorPrimaryInt);
}

// Set the OnTabSelected listener.
this.mTabLayout.addOnTabSelectedListener(this);

Expand Down Expand Up @@ -158,26 +184,8 @@ public void addTabItemInController(TabProxy tabProxy)
// Add the new tab to the TabLayout.
this.mTabLayout.addTab(newTab);

// Create a background drawable with ripple effect for the state used by TabLayout.Tab.
Drawable backgroundDrawable = createBackgroundDrawableForState(tabProxy, android.R.attr.state_selected);

// Go through the layout to set the background color state drawable manually for each tab.
// Currently we support only the default type of TabLayout which has a SlidingTabStrip.
try {
LinearLayout stripLayout = ((LinearLayout) this.mTabLayout.getChildAt(0));
// Get the just added TabView as a LinearLayout in order to set the background.
LinearLayout tabLL = ((LinearLayout) stripLayout.getChildAt(this.mTabLayout.getTabCount() - 1));
tabLL.setBackground(backgroundDrawable);
// Set the TextView textColor.
for (int i = 0; i < tabLL.getChildCount(); i++) {
if (tabLL.getChildAt(i) instanceof TextView) {
((TextView) tabLL.getChildAt(i))
.setTextColor(textColorStateList(tabProxy, android.R.attr.state_selected));
}
}
} catch (Exception e) {
Log.w(TAG, WARNING_LAYOUT_MESSAGE);
}
// Set the drawables for the most recently added Tab.
setDrawablesForTab(this.mTabLayout.getTabCount() - 1);
}

/**
Expand Down Expand Up @@ -205,15 +213,19 @@ public void selectTabItemInController(int position)
this.mTabLayout.addOnTabSelectedListener(this);
}

/**
* Set the background drawable for TabLayout.
*
* @param drawable the new background drawable.
*/
@Override
public void setBackgroundDrawable(Drawable drawable)
public void setBackgroundColor(int colorInt)
{
this.mTabLayout.setBackground(drawable);
this.mTabLayout.setBackgroundColor(colorInt);
}

@Override
public void setDrawables()
{
ArrayList<TabProxy> tabProxiesList = ((TabGroupProxy) this.proxy).getTabList();
for (TabProxy tabProxy : tabProxiesList) {
setDrawablesForTab(tabProxiesList.indexOf(tabProxy));
}
}

/**
Expand Down