mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-15 02:54:11 +08:00
fix: android Tabs selected item color incorrectly applied (#9040)
* fix: selected-item-color gets applied to wrong TabStripItems * chore: Added selection colors to 2 ui examples. * chore: Removing used for testing.
This commit is contained in:

committed by
GitHub

parent
e16bc606ef
commit
b47ce0a97c
15
apps/ui/src/tabs/swipe-disabled-page.ts
Normal file
15
apps/ui/src/tabs/swipe-disabled-page.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { EventData, Page, Tabs } from '@nativescript/core';
|
||||
|
||||
export function goToFirst(args: EventData) {
|
||||
console.log('---> goToFirst');
|
||||
const page = <Page>(<any>args.object).page;
|
||||
const tabsNav = <Tabs>page.getViewById('tabs');
|
||||
tabsNav.selectedIndex = 0;
|
||||
}
|
||||
|
||||
export function goToSecond(args: EventData) {
|
||||
console.log('---> goToSecond');
|
||||
const page = <Page>(<any>args.object).page;
|
||||
const tabsNav = <Tabs>page.getViewById('tabs');
|
||||
tabsNav.selectedIndex = 1;
|
||||
}
|
@ -4,7 +4,7 @@
|
||||
</ActionBar>
|
||||
|
||||
<Tabs id="tabs" swipeEnabled="false" automationText="tabNavigation" >
|
||||
<TabStrip>
|
||||
<TabStrip selectedItemColor="red" unSelectedItemColor="black">
|
||||
<TabStripItem title="First Tab 11" iconSource="res://icon"></TabStripItem>
|
||||
<TabStripItem>
|
||||
<!-- <Image src="res://icon" /> -->
|
||||
|
@ -4,7 +4,7 @@
|
||||
</ActionBar>
|
||||
|
||||
<Tabs id="tabs" tabsPosition="bottom" automationText="tabNavigation" >
|
||||
<TabStrip>
|
||||
<TabStrip selectedItemColor="blue" unSelectedItemColor="gray">
|
||||
<TabStripItem title="First Tab 11" iconSource="res://icon"></TabStripItem>
|
||||
<TabStripItem>
|
||||
<!-- <Image src="res://icon" /> -->
|
||||
|
Binary file not shown.
@ -141,6 +141,7 @@ function initializeNativeClasses() {
|
||||
public items: Array<TabContentItem>;
|
||||
private mCurTransaction: androidx.fragment.app.FragmentTransaction;
|
||||
private mCurrentPrimaryItem: androidx.fragment.app.Fragment;
|
||||
private mCurrentPosition = -1;
|
||||
|
||||
constructor(public owner: Tabs) {
|
||||
super();
|
||||
@ -238,9 +239,27 @@ function initializeNativeClasses() {
|
||||
}
|
||||
|
||||
this.mCurrentPrimaryItem = fragment;
|
||||
this.owner.selectedIndex = position;
|
||||
const previousPosition = this.mCurrentPosition;
|
||||
this.mCurrentPosition = position;
|
||||
|
||||
const tab = this.owner;
|
||||
tab.selectedIndex = position;
|
||||
|
||||
// Update tabstrip items
|
||||
if (position != previousPosition) {
|
||||
const tabStripItems = tab.tabStrip && tab.tabStrip.items;
|
||||
|
||||
if (position >= 0 && tabStripItems && tabStripItems[position]) {
|
||||
tabStripItems[position]._emit(TabStripItem.selectEvent);
|
||||
tab._setItemColor(tabStripItems[position]);
|
||||
}
|
||||
|
||||
if (previousPosition >= 0 && tabStripItems && tabStripItems[previousPosition]) {
|
||||
tabStripItems[previousPosition]._emit(TabStripItem.unselectEvent);
|
||||
tab._setItemColor(tabStripItems[previousPosition]);
|
||||
}
|
||||
}
|
||||
|
||||
const tabItems = tab.items;
|
||||
const newTabItem = tabItems ? tabItems[position] : null;
|
||||
|
||||
@ -290,25 +309,6 @@ function initializeNativeClasses() {
|
||||
return global.__native(this);
|
||||
}
|
||||
|
||||
public onSelectedPositionChange(position: number, prevPosition: number): void {
|
||||
const owner = this.owner;
|
||||
if (!owner) {
|
||||
return;
|
||||
}
|
||||
|
||||
const tabStripItems = owner.tabStrip && owner.tabStrip.items;
|
||||
|
||||
if (position >= 0 && tabStripItems && tabStripItems[position]) {
|
||||
tabStripItems[position]._emit(TabStripItem.selectEvent);
|
||||
owner._setItemColor(tabStripItems[position]);
|
||||
}
|
||||
|
||||
if (prevPosition >= 0 && tabStripItems && tabStripItems[prevPosition]) {
|
||||
tabStripItems[prevPosition]._emit(TabStripItem.unselectEvent);
|
||||
owner._setItemColor(tabStripItems[prevPosition]);
|
||||
}
|
||||
}
|
||||
|
||||
public onTap(position: number): boolean {
|
||||
const owner = this.owner;
|
||||
if (!owner) {
|
||||
@ -952,11 +952,9 @@ export class Tabs extends TabsBase {
|
||||
}
|
||||
|
||||
[selectedIndexProperty.setNative](value: number) {
|
||||
// TODO
|
||||
// if (Trace.isEnabled()) {
|
||||
// Trace.write("TabView this._viewPager.setCurrentItem(" + value + ", " + smoothScroll + ");", traceCategory);
|
||||
// }
|
||||
this._viewPager.setCurrentItem(value, this.animationEnabled);
|
||||
if (this._viewPager.getCurrentItem() != value) {
|
||||
this._viewPager.setCurrentItem(value);
|
||||
}
|
||||
}
|
||||
|
||||
[itemsProperty.getDefault](): TabContentItem[] {
|
||||
|
@ -12,7 +12,7 @@ export * from '../tab-navigation-base/tab-navigation-base';
|
||||
export * from '../tab-navigation-base/tab-strip';
|
||||
export * from '../tab-navigation-base/tab-strip-item';
|
||||
|
||||
export const traceCategory = 'TabView';
|
||||
export const traceCategory = 'Tabs';
|
||||
|
||||
@CSSType('Tabs')
|
||||
export class TabsBase extends TabNavigationBase implements TabsDefinition {
|
||||
|
@ -56,7 +56,7 @@ public class TabViewPager extends ViewPager {
|
||||
|
||||
@Override
|
||||
public void setCurrentItem(int item) {
|
||||
boolean smoothScroll = this.animationEnabled && this.swipePageEnabled;
|
||||
boolean smoothScroll = this.animationEnabled;
|
||||
super.setCurrentItem(item, smoothScroll);
|
||||
}
|
||||
}
|
||||
|
@ -317,10 +317,6 @@ public class TabsBar extends HorizontalScrollView {
|
||||
return true;
|
||||
}
|
||||
|
||||
public void onSelectedPositionChange(int position, int prevPosition) {
|
||||
// to be overridden in JS
|
||||
}
|
||||
|
||||
private void populateTabStrip() {
|
||||
final PagerAdapter adapter = mViewPager.getAdapter();
|
||||
final OnClickListener tabClickListener = new TabClickListener();
|
||||
@ -394,12 +390,6 @@ public class TabsBar extends HorizontalScrollView {
|
||||
return;
|
||||
}
|
||||
|
||||
int prevPosition = mTabStrip.getSelectedPosition();
|
||||
|
||||
if (prevPosition != position) {
|
||||
onSelectedPositionChange(position, prevPosition);
|
||||
}
|
||||
|
||||
mTabStrip.onTabsViewPagerPageChanged(position, positionOffset);
|
||||
|
||||
View selectedTitle = mTabStrip.getChildAt(position);
|
||||
|
Reference in New Issue
Block a user