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.

Sign up for GitHub

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

Jump to bottom

fix(android/ios)(9_0_X): amend Tab tintColor and activeTintColor #11741

Merged
merged 30 commits into from
Jun 8, 2020
Merged

fix(android/ios)(9_0_X): amend Tab tintColor and activeTintColor #11741

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
593573a
fix(android): amend titleColor and implement tintColor
garymathews Apr 2, 2020
0872e0d
docs: update documentation
garymathews Apr 2, 2020
fb53dd1
fix(android): amend shiftMode behaviour
garymathews Apr 3, 2020
1f25ebd
fix(android): allow Tab barColor to be set
garymathews Apr 3, 2020
a25e221
fix(android): clean up tint color implementation
garymathews Apr 7, 2020
4f03285
fix(ios): allow tint color of tabs
garymathews Apr 7, 2020
0d3185e
docs: deprecate redundant color properties
garymathews Apr 7, 2020
cf083b1
fix(android): lint
garymathews Apr 7, 2020
a06c5cc
fix(ios): use imageWithTintColor and define render mode
Apr 9, 2020
ea06da3
fix: lint
Apr 9, 2020
a6abc8b
test: include Tab and TabGroup test cases
garymathews Apr 14, 2020
8c75fc7
fix(ios): implement compatability imageWithTint method
garymathews May 29, 2020
3c84a59
fix(ios): always return image
garymathews May 29, 2020
6f07792
fix(ios): formatting
May 29, 2020
7d8ae94
fix(ios): use compatibility tint method
May 29, 2020
f34f3a4
docs: include missing docs for titleColor
May 29, 2020
58ae4c7
fix(docs): remove invalid type
garymathews May 29, 2020
b2b01c1
fix(android): formatting
garymathews May 29, 2020
07884cd
fix(ios): formatting
garymathews May 29, 2020
76d15f2
fix(android): amend tab indicator and tintColor
garymathews Jun 2, 2020
d39bebf
docs: update tintColor descriptions
garymathews Jun 2, 2020
eed8f21
fix(ios): fallback to titleColor
garymathews Jun 2, 2020
0c2cb41
fix(android): remove redundant code
garymathews Jun 2, 2020
8e0c737
fix(ios): amend imageWithTint method
Jun 3, 2020
d3c0b3f
fix(android): improve shiftMode property
Jun 3, 2020
1dcdee8
fix(android): remove warning
Jun 3, 2020
0fcdcb1
docs: update versions
Jun 3, 2020
8e480bd
Merge branch '9_0_X' into TIMOB-27830_90X
garymathews Jun 3, 2020
3d1cc27
Merge branch '9_0_X' into TIMOB-27830_90X
sgtcoolguy Jun 5, 2020
2602823
fix(android): amend shiftMode behaviour
garymathews Jun 5, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
113 changes: 90 additions & 23 deletions android/modules/ui/src/java/ti/modules/titanium/ui/widget/tabgroup/TiUIAbstractTabGroup.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,42 +8,41 @@

import android.content.res.ColorStateList;
import android.content.res.TypedArray;
import android.graphics.PorterDuff;
import android.graphics.drawable.ColorDrawable;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.RippleDrawable;
import android.graphics.drawable.StateListDrawable;
import android.os.Build;
import android.os.Bundle;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentPagerAdapter;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
import android.util.TypedValue;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;

import org.appcelerator.kroll.common.Log;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentPagerAdapter;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.concurrent.atomic.AtomicLong;
import org.appcelerator.kroll.KrollDict;
import org.appcelerator.kroll.KrollProxy;
import org.appcelerator.kroll.common.Log;
import org.appcelerator.titanium.TiBaseActivity;
import org.appcelerator.titanium.TiC;
import org.appcelerator.titanium.proxy.ActivityProxy;
import org.appcelerator.titanium.proxy.TiViewProxy;
import org.appcelerator.titanium.proxy.TiWindowProxy;
import org.appcelerator.titanium.util.TiColorHelper;
import org.appcelerator.titanium.util.TiConvert;
import org.appcelerator.titanium.util.TiRHelper;
import org.appcelerator.titanium.view.TiInsetsProvider;
import org.appcelerator.titanium.view.TiUIView;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.concurrent.atomic.AtomicLong;

import ti.modules.titanium.ui.TabGroupProxy;
import ti.modules.titanium.ui.TabProxy;

Expand Down Expand Up @@ -254,15 +253,24 @@ public void addTab(TabProxy tabProxy)
protected ColorStateList textColorStateList(TiViewProxy tabProxy, int stateToUse)
{
int[][] textColorStates = new int[][] { new int[] { -stateToUse }, new int[] { stateToUse } };
int[] textColors = { tabProxy.hasPropertyAndNotNull(TiC.PROPERTY_TITLE_COLOR)
? TiColorHelper.parseColor(tabProxy.getProperty(TiC.PROPERTY_TITLE_COLOR).toString())
: this.textColorInt,
tabProxy.hasPropertyAndNotNull(TiC.PROPERTY_ACTIVE_TITLE_COLOR)
? TiColorHelper.parseColor(
tabProxy.getProperty(TiC.PROPERTY_ACTIVE_TITLE_COLOR).toString())
: this.textColorInt };
ColorStateList stateListDrawable = new ColorStateList(textColorStates, textColors);
return stateListDrawable;
int[] textColors = { this.textColorInt, this.textColorInt };

final KrollDict tabProperties = tabProxy.getProperties();
final KrollDict properties = getProxy().getProperties();

if (tabProperties.containsKeyAndNotNull(TiC.PROPERTY_TITLE_COLOR)
|| properties.containsKeyAndNotNull(TiC.PROPERTY_TITLE_COLOR)) {
final String colorString =
tabProperties.optString(TiC.PROPERTY_TITLE_COLOR, properties.getString(TiC.PROPERTY_TITLE_COLOR));
textColors[0] = TiColorHelper.parseColor(colorString);
}
if (tabProperties.containsKeyAndNotNull(TiC.PROPERTY_ACTIVE_TITLE_COLOR)
|| properties.containsKeyAndNotNull(TiC.PROPERTY_ACTIVE_TITLE_COLOR)) {
final String colorString = tabProperties.optString(TiC.PROPERTY_ACTIVE_TITLE_COLOR,
properties.getString(TiC.PROPERTY_ACTIVE_TITLE_COLOR));
textColors[1] = TiColorHelper.parseColor(colorString);
}
return new ColorStateList(textColorStates, textColors);
}

/**
Expand Down Expand Up @@ -361,13 +369,30 @@ public void onPageScrolled(int i, float v, int i1)
public void onPageSelected(int i)
{
selectTabItemInController(i);
selectTab(i);
}

@Override
public void onPageScrollStateChanged(int i)
{
}
});

// Set action bar color.
final ActionBar actionBar = ((AppCompatActivity) proxy.getActivity()).getSupportActionBar();
if (actionBar != null) {
final TiWindowProxy windowProxy = ((TabProxy) this.tabs.get(tabIndex).getProxy()).getWindow();
final KrollDict windowProperties = windowProxy.getProperties();
final KrollDict properties = getProxy().getProperties();

if (properties.containsKeyAndNotNull(TiC.PROPERTY_BAR_COLOR)
|| windowProperties.containsKeyAndNotNull(TiC.PROPERTY_BAR_COLOR)) {
final String colorString =
properties.optString(TiC.PROPERTY_BAR_COLOR, windowProperties.getString(TiC.PROPERTY_BAR_COLOR));
final int color = TiColorHelper.parseColor(colorString);
actionBar.setBackgroundDrawable(new ColorDrawable(color));
}
}
}

@Override
Expand Down Expand Up @@ -426,6 +451,48 @@ public void updateTitle(String title)
}
}

public Drawable updateIconTint(TiViewProxy tabProxy, Drawable drawable, boolean selected)
{
if (drawable == null) {
return null;
}

final KrollDict tabProperties = tabProxy.getProperties();
final KrollDict properties = getProxy().getProperties();

int color = this.textColorInt;
if (selected) {
if (tabProperties.containsKeyAndNotNull(TiC.PROPERTY_ACTIVE_TINT_COLOR)
|| properties.containsKeyAndNotNull(TiC.PROPERTY_ACTIVE_TINT_COLOR)
|| tabProperties.containsKeyAndNotNull(TiC.PROPERTY_ACTIVE_TITLE_COLOR)
|| properties.containsKeyAndNotNull(TiC.PROPERTY_ACTIVE_TITLE_COLOR)) {
final String colorString = tabProperties.optString(
TiC.PROPERTY_ACTIVE_TINT_COLOR,
properties.optString(
TiC.PROPERTY_ACTIVE_TINT_COLOR,
tabProperties.optString(TiC.PROPERTY_ACTIVE_TITLE_COLOR,
properties.getString(TiC.PROPERTY_ACTIVE_TITLE_COLOR))));
color = TiColorHelper.parseColor(colorString);
}
drawable.setColorFilter(color, PorterDuff.Mode.SRC_IN);
} else {
if (tabProperties.containsKeyAndNotNull(TiC.PROPERTY_TINT_COLOR)
|| properties.containsKeyAndNotNull(TiC.PROPERTY_TINT_COLOR)
|| tabProperties.containsKeyAndNotNull(TiC.PROPERTY_TITLE_COLOR)
|| properties.containsKeyAndNotNull(TiC.PROPERTY_TITLE_COLOR)) {
final String colorString = tabProperties.optString(
TiC.PROPERTY_TINT_COLOR,
properties.optString(TiC.PROPERTY_TINT_COLOR,
tabProperties.optString(TiC.PROPERTY_TITLE_COLOR,
properties.getString(TiC.PROPERTY_TITLE_COLOR))));
color = TiColorHelper.parseColor(colorString);
}
drawable.setColorFilter(color, PorterDuff.Mode.SRC_IN);
}

return drawable;
}

/**
* Implementation of the FragmentPagerAdapter
*/
Expand Down
58 changes: 43 additions & 15 deletions ...ules/ui/src/java/ti/modules/titanium/ui/widget/tabgroup/TiUIBottomNavigationTabGroup.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,17 +6,18 @@
*/
package ti.modules.titanium.ui.widget.tabgroup;

import android.annotation.SuppressLint;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewParent;
import com.google.android.material.bottomnavigation.BottomNavigationItemView;
import com.google.android.material.bottomnavigation.BottomNavigationMenuView;
import com.google.android.material.bottomnavigation.BottomNavigationView;
import com.google.android.material.bottomnavigation.LabelVisibilityMode;

import android.view.MenuItem;
import android.view.View;
import android.view.ViewParent;

import java.lang.reflect.Field;
import java.util.ArrayList;
import org.appcelerator.kroll.common.Log;
import org.appcelerator.titanium.TiBaseActivity;
import org.appcelerator.titanium.TiC;
Expand All @@ -25,10 +26,6 @@
import org.appcelerator.titanium.util.TiConvert;
import org.appcelerator.titanium.util.TiUIHelper;
import org.appcelerator.titanium.view.TiCompositeLayout;

import java.lang.reflect.Field;
import java.util.ArrayList;

import ti.modules.titanium.ui.TabGroupProxy;
import ti.modules.titanium.ui.TabProxy;

Expand Down Expand Up @@ -169,12 +166,18 @@ public void addTabItemInController(TiViewProxy tabProxy)
int index = this.mMenuItemsArray.size() - 1;
updateDrawablesAfterNewItem(index);
// Handle shift mode.
if (this.proxy.hasPropertyAndNotNull(TiC.PROPERTY_SHIFT_MODE)) {
if (!((Boolean) proxy.getProperty(TiC.PROPERTY_SHIFT_MODE))) {
final int shiftMode = proxy.getProperties().optInt(TiC.PROPERTY_SHIFT_MODE, 1);
switch (shiftMode) {
case 0:
this.mBottomNavigationView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_LABELED);
} else {
this.mBottomNavigationView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_SELECTED);
}
break;
case 1:
this.mBottomNavigationView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_AUTO);
break;
case 2:
// NOTE: Undocumented for now, will create new property that has parity with iOS.
this.mBottomNavigationView.setLabelVisibilityMode(LabelVisibilityMode.LABEL_VISIBILITY_UNLABELED);
break;
}
}

Expand Down Expand Up @@ -268,6 +271,7 @@ public void updateTabTitle(int index)
this.mBottomNavigationView.getMenu().getItem(index).setTitle(title);
}

@SuppressLint("RestrictedApi")
@Override
public void updateTabTitleColor(int index)
{
Expand Down Expand Up @@ -296,7 +300,7 @@ public void updateTabIcon(int index)
return;
}

Drawable drawable = TiUIHelper.getResourceDrawable(tabProxy.getProperty(TiC.PROPERTY_ICON));
final Drawable drawable = TiUIHelper.getResourceDrawable(tabProxy.getProperty(TiC.PROPERTY_ICON));
this.mBottomNavigationView.getMenu().getItem(index).setIcon(drawable);
}

Expand Down Expand Up @@ -337,8 +341,32 @@ public boolean onMenuItemClick(MenuItem item)
}
// Make the ViewPager to select the proper page too.
selectTab(index);

// Trigger the select event firing for the new tab.
((TabGroupProxy) getProxy()).onTabSelected(index);
return false;
}

private void updateIconTint()
{
for (int i = 0; i < this.mMenuItemsArray.size(); i++) {
final TiUITab tab = this.tabs.get(i);
if (tab.getProxy() != null) {
final TiViewProxy tabProxy = tab.getProxy();
final boolean selected = i == currentlySelectedIndex;
Drawable drawable = this.mBottomNavigationView.getMenu().getItem(i).getIcon();
drawable = updateIconTint(tabProxy, drawable, selected);
this.mBottomNavigationView.getMenu().getItem(i).setIcon(drawable);
}
}
}

@Override
public void selectTab(int tabIndex)
{
super.selectTab(tabIndex);

updateIconTint();
updateTabBackgroundDrawable(tabIndex);
}
}
58 changes: 38 additions & 20 deletions ...oid/modules/ui/src/java/ti/modules/titanium/ui/widget/tabgroup/TiUITabLayoutTabGroup.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,10 @@
import android.content.res.Configuration;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import com.google.android.material.tabs.TabLayout;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.google.android.material.tabs.TabLayout;
import org.appcelerator.kroll.common.Log;
import org.appcelerator.titanium.TiBaseActivity;
import org.appcelerator.titanium.TiC;
Expand All @@ -22,7 +21,6 @@
import org.appcelerator.titanium.util.TiConvert;
import org.appcelerator.titanium.util.TiUIHelper;
import org.appcelerator.titanium.view.TiCompositeLayout;

import ti.modules.titanium.ui.TabGroupProxy;

/**
Expand Down Expand Up @@ -196,25 +194,17 @@ public void setBackgroundColor(int colorInt)
@Override
public void updateTabBackgroundDrawable(int index)
{
// Validate index input.
if (index < 0 || index >= tabs.size()) {
return;
}
TiViewProxy tabProxy = tabs.get(index).getProxy();

final TiViewProxy tabProxy = tabs.get(index).getProxy();
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 tabLL = getTabLinearLayoutForIndex(index);
tabLL.setBackground(backgroundDrawable);
} catch (Exception e) {
Log.w(TAG, WARNING_LAYOUT_MESSAGE);
}
final Drawable backgroundDrawable = createBackgroundDrawableForState(tabProxy, android.R.attr.state_selected);
this.mTabLayout.setBackground(backgroundDrawable);
}

@Override
Expand Down Expand Up @@ -246,12 +236,17 @@ public void updateTabTitleColor(int index)
}

try {
LinearLayout tabLL = getTabLinearLayoutForIndex(index);
final LinearLayout tabLayout = getTabLinearLayoutForIndex(index);
// 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));
for (int i = 0; i < tabLayout.getChildCount(); i++) {
if (tabLayout.getChildAt(i) instanceof TextView) {
final TextView textView = (TextView) tabLayout.getChildAt(i);

//TIMOB-27830: Update text color after layout for change to take effect.
tabLayout.addOnLayoutChangeListener(
(v, left, top, right, bottom, oldLeft, oldTop, oldRight, oldBottom) -> {
textView.setTextColor(textColorStateList(tabProxy, android.R.attr.state_selected));
});
}
}
} catch (Exception e) {
Expand Down Expand Up @@ -331,4 +326,27 @@ private LinearLayout getTabLinearLayoutForIndex(int index)
// Get the just added TabView as a LinearLayout in order to set the background.
return ((LinearLayout) stripLayout.getChildAt(index));
}

private void updateIconTint()
{
for (int i = 0; i < this.mTabLayout.getTabCount(); i++) {
final TiUITab tab = this.tabs.get(i);
if (tab.getProxy() != null) {
final TiViewProxy tabProxy = tab.getProxy();
final boolean selected = i == this.mTabLayout.getSelectedTabPosition();
Drawable drawable = this.mTabLayout.getTabAt(i).getIcon();
drawable = updateIconTint(tabProxy, drawable, selected);
this.mTabLayout.getTabAt(i).setIcon(drawable);
}
}
}

@Override
public void selectTab(int tabIndex)
{
super.selectTab(tabIndex);

updateIconTint();
updateTabBackgroundDrawable(tabIndex);
}
}
7 changes: 6 additions & 1 deletion android/titanium/src/java/org/appcelerator/titanium/TiC.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -798,10 +798,15 @@ public class TiC
public static final String PROPERTY_ACTIVE_TAB = "activeTab";

/**
* @module.ape
* @module.api
*/
public static final String PROPERTY_ACTIVE_TITLE_COLOR = "activeTitleColor";

/**
* @module.api
*/
public static final String PROPERTY_ACTIVE_TINT_COLOR = "activeTintColor";

/**
* @module.api
*/
Expand Down
Loading