FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

feat(tabview): add tab text font size property by MartoYankov · Pull Request #5752 · NativeScript/NativeScript · GitHub

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension .ts  (8) .xml  (1) All 2 file types selected
Viewed files
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Unified
Split
Hide whitespace
Diff view
Unified
Split
Hide whitespace
1 change: 1 addition & 0 deletions apps/app/ui-tests-app/tab-view/main-page.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -23,5 +23,6 @@ export function loadExamples() {
examples.set("text-transform", "tab-view/text-transform");
examples.set("tab-view-bottom-position", "tab-view/tab-view-bottom-position");
examples.set("issue-5470", "tab-view/issue-5470");
examples.set("tab-view-tab-text-font-size", "tab-view/tab-view-tab-text-font-size");
return examples;
}
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<Page>
<TabView tabTextFontSize="8">
<TabView.items>
<TabViewItem title="First">
<TabViewItem.view>
<GridLayout>
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
</GridLayout>
</TabViewItem.view>
</TabViewItem>
<TabViewItem title="Second">
<TabViewItem.view>
<GridLayout>
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
</GridLayout>
</TabViewItem.view>
</TabViewItem>
</TabView.items>
</TabView>
</Page>
1 change: 1 addition & 0 deletions tns-core-modules/ui/styling/style/style.d.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -120,6 +120,7 @@ export class Style extends Observable {
public verticalAlignment: VerticalAlignment;

// TabView-specific props
public tabTextFontSize: number;
public tabTextColor: Color;
public tabBackgroundColor: Color;
public selectedTabTextColor: Color;
Expand Down
1 change: 1 addition & 0 deletions tns-core-modules/ui/styling/style/style.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@ export class Style extends Observable implements StyleDefinition {
public verticalAlignment: VerticalAlignment;

// TabView-specific props
public tabTextFontSize: number;
public tabTextColor: Color;
public tabBackgroundColor: Color;
public selectedTabTextColor: Color;
Expand Down
10 changes: 10 additions & 0 deletions tns-core-modules/ui/tab-view/tab-view-common.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,13 @@ export class TabViewBase extends View implements TabViewDefinition, AddChildFrom
this.style.androidSelectedTabHighlightColor = value;
}

get tabTextFontSize(): number {
return this.style.tabTextFontSize;
}
set tabTextFontSize(value: number) {
this.style.tabTextFontSize = value;
}

get tabTextColor(): Color {
return this.style.tabTextColor;
}
Expand Down Expand Up @@ -240,6 +247,9 @@ androidOffscreenTabLimitProperty.register(TabViewBase);
export const androidTabsPositionProperty = new Property<TabViewBase, "top" | "bottom">({ name: "androidTabsPosition", defaultValue: "top" });
androidTabsPositionProperty.register(TabViewBase);

export const tabTextFontSizeProperty = new CssProperty<Style, number>({ name: "tabTextFontSize", cssName: "tab-text-font-size", valueConverter: (v) => parseFloat(v) });
tabTextFontSizeProperty.register(Style);

export const tabTextColorProperty = new CssProperty<Style, Color>({ name: "tabTextColor", cssName: "tab-text-color", equalityComparer: Color.equals, valueConverter: (v) => new Color(v) });
tabTextColorProperty.register(Style);

Expand Down
13 changes: 12 additions & 1 deletion tns-core-modules/ui/tab-view/tab-view.android.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Font } from "../styling/font";

import {
TabViewBase, TabViewItemBase, itemsProperty, selectedIndexProperty,
tabTextColorProperty, tabBackgroundColorProperty, selectedTabTextColorProperty,
tabTextColorProperty, tabBackgroundColorProperty, tabTextFontSizeProperty, selectedTabTextColorProperty,
androidSelectedTabHighlightColorProperty, androidOffscreenTabLimitProperty,
fontSizeProperty, fontInternalProperty, View, layout, traceCategory, traceEnabled,
traceWrite, Color
Expand Down Expand Up @@ -624,6 +624,17 @@ export class TabView extends TabViewBase {
}
}

[tabTextFontSizeProperty.getDefault](): number {
return this._tabLayout.getTabTextFontSize();
}
[tabTextFontSizeProperty.setNative](value: number | { nativeSize: number }) {
if (typeof value === "number") {
this._tabLayout.setTabTextFontSize(value);
} else {
this._tabLayout.setTabTextFontSize(value.nativeSize);
}
}

[tabTextColorProperty.getDefault](): number {
return this._tabLayout.getTabTextColor();
}
Expand Down
6 changes: 6 additions & 0 deletions tns-core-modules/ui/tab-view/tab-view.d.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,11 @@ export class TabView extends View {
*/
selectedIndex: number;

/**
* Gets or sets the font size of the tabs titles.
*/
tabTextFontSize: number;

/**
* Gets or sets the text color of the tabs titles.
*/
Expand Down Expand Up @@ -139,6 +144,7 @@ export class TabView extends View {
export const itemsProperty: Property<TabView, TabViewItem[]>;
export const selectedIndexProperty: Property<TabView, number>;

export const tabTextFontSizeProperty: CssProperty<Style, number>;
export const tabTextColorProperty: CssProperty<Style, Color>;
export const tabBackgroundColorProperty: CssProperty<Style, Color>;
export const selectedTabTextColorProperty: CssProperty<Style, Color>;
Expand Down
13 changes: 11 additions & 2 deletions tns-core-modules/ui/tab-view/tab-view.ios.ts
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { Font } from "../styling/font";
import { ios as iosView, ViewBase } from "../core/view";
import {
TabViewBase, TabViewItemBase, itemsProperty, selectedIndexProperty,
tabTextColorProperty, tabBackgroundColorProperty, selectedTabTextColorProperty, iosIconRenderingModeProperty,
tabTextColorProperty, tabTextFontSizeProperty, tabBackgroundColorProperty, selectedTabTextColorProperty, iosIconRenderingModeProperty,
View, fontInternalProperty, layout, traceEnabled, traceWrite, traceCategories, Color
} from "./tab-view-common"
import { textTransformProperty, TextTransform, getTransformedText } from "../text-base";
Expand Down Expand Up @@ -448,6 +448,13 @@ export class TabView extends TabViewBase {
selectedIndexProperty.coerce(this);
}

[tabTextFontSizeProperty.getDefault](): number {
return null;
}
[tabTextFontSizeProperty.setNative](value: number | { nativeSize: number }) {
this._updateIOSTabBarColorsAndFonts();
}

[tabTextColorProperty.getDefault](): UIColor {
return null;
}
Expand Down Expand Up @@ -504,7 +511,9 @@ interface TabStates {
function getTitleAttributesForStates(tabView: TabView): TabStates {
const result: TabStates = {};

const font = tabView.style.fontInternal.getUIFont(UIFont.systemFontOfSize(10));
const defaultTabItemFontSize = 10;
const tabItemFontSize = tabView.style.tabTextFontSize || defaultTabItemFontSize;
const font: UIFont = tabView.style.fontInternal.getUIFont(UIFont.systemFontOfSize(tabItemFontSize));
const tabItemTextColor = tabView.style.tabTextColor;
const textColor = tabItemTextColor instanceof Color ? tabItemTextColor.ios : null;
result.normalState = { [NSFontAttributeName]: font }
Expand Down
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters. Learn more about bidirectional Unicode characters
Original file line number Diff line number Diff line change
Expand Up @@ -362,6 +362,8 @@
getTabTextColor(): number;
setSelectedTabTextColor(color: number): void;
getSelectedTabTextColor(): number;
setTabTextFontSize(fontSize: number): void;
getTabTextFontSize(): number;

setItems(items: Array<TabItemSpec>, viewPager: android.support.v4.view.ViewPager): void;
updateItemAt(position: number, itemSpec: TabItemSpec): void;
Expand Down

Back | FazBrowse Home | New Git URL