feat(tabs): iconSource support for sys:// and font:// icons

closes https://github.com/NativeScript/NativeScript/issues/10729
This commit is contained in:
Nathan Walker
2025-08-18 22:17:04 -07:00
parent dc1e2d761e
commit 226dc85efb
4 changed files with 34 additions and 15 deletions

View File

@@ -65,13 +65,13 @@ export class ImageSource {
* Loads this instance from the specified system image name. * Loads this instance from the specified system image name.
* @param name the name of the system image * @param name the name of the system image
*/ */
static fromSystemImageSync(name: string, instance: ImageBase): ImageSource; static fromSystemImageSync(name: string, instance?: ImageBase): ImageSource;
/** /**
* Loads this instance from the specified system image name asynchronously. * Loads this instance from the specified system image name asynchronously.
* @param name the name of the system image * @param name the name of the system image
*/ */
static fromSystemImage(name: string, instance: ImageBase): Promise<ImageSource>; static fromSystemImage(name: string, instance?: ImageBase): Promise<ImageSource>;
/** /**
* Loads this instance from the specified file. * Loads this instance from the specified file.

View File

@@ -12,7 +12,8 @@ import { CoreTypes } from '../../core-types';
import { ImageSource } from '../../image-source'; import { ImageSource } from '../../image-source';
import { profile } from '../../profiling'; import { profile } from '../../profiling';
import { Frame } from '../frame'; import { Frame } from '../frame';
import { layout } from '../../utils'; import { layout } from '../../utils/layout-helper';
import { isFontIconURI, isSystemURI, SYSTEM_PREFIX } from '../../utils/common';
import { SDK_VERSION } from '../../utils/constants'; import { SDK_VERSION } from '../../utils/constants';
import { Device } from '../../platform'; import { Device } from '../../platform';
export * from './tab-view-common'; export * from './tab-view-common';
@@ -239,7 +240,7 @@ export class TabViewItem extends TabViewItemBase {
const parent = <TabView>this.parent; const parent = <TabView>this.parent;
const controller = this.__controller; const controller = this.__controller;
if (parent && controller) { if (parent && controller) {
const icon = parent._getIcon(this.iconSource); const icon = parent._getIcon(this);
const index = parent.items.indexOf(this); const index = parent.items.indexOf(this);
const title = getTransformedText(this.title, this.style.textTransform); const title = getTransformedText(this.title, this.style.textTransform);
@@ -456,7 +457,7 @@ export class TabView extends TabViewBase {
items.forEach((item, i) => { items.forEach((item, i) => {
const controller = this.getViewController(item); const controller = this.getViewController(item);
const icon = this._getIcon(item.iconSource); const icon = this._getIcon(item);
const tabBarItem = UITabBarItem.alloc().initWithTitleImageTag(item.title || '', icon, i); const tabBarItem = UITabBarItem.alloc().initWithTitleImageTag(item.title || '', icon, i);
updateTitleAndIconPositions(item, tabBarItem, controller); updateTitleAndIconPositions(item, tabBarItem, controller);
@@ -492,20 +493,27 @@ export class TabView extends TabViewBase {
} }
} }
public _getIcon(iconSource: string): UIImage { public _getIcon(item: TabViewItem): UIImage {
if (!iconSource) { if (!item || !item.iconSource) {
return null; return null;
} }
let image: UIImage = this._iconsCache[iconSource]; let image: UIImage = this._iconsCache[item.iconSource];
if (!image) { if (!image) {
const is = ImageSource.fromFileOrResourceSync(iconSource); let is: ImageSource;
if (isSystemURI(item.iconSource)) {
is = ImageSource.fromSystemImageSync(item.iconSource.slice(SYSTEM_PREFIX.length));
} else if (isFontIconURI(item.iconSource)) {
is = ImageSource.fromFontIconCodeSync(item.iconSource, item.style.fontInternal, item.style.color);
} else {
is = ImageSource.fromFileOrResourceSync(item.iconSource);
}
if (is && is.ios) { if (is && is.ios) {
const originalRenderedImage = is.ios.imageWithRenderingMode(this._getIconRenderingMode()); const originalRenderedImage = is.ios.imageWithRenderingMode(this._getIconRenderingMode());
this._iconsCache[iconSource] = originalRenderedImage; this._iconsCache[item.iconSource] = originalRenderedImage;
image = originalRenderedImage; image = originalRenderedImage;
} else { } else {
traceMissingIcon(iconSource); traceMissingIcon(item.iconSource);
} }
} }

View File

@@ -7,9 +7,10 @@ import { GC } from './index';
export * from './mainthread-helper'; export * from './mainthread-helper';
export * from './macrotask-scheduler'; export * from './macrotask-scheduler';
export const FILE_PREFIX = 'file:///';
export const FONT_PREFIX = 'font://';
export const RESOURCE_PREFIX = 'res://'; export const RESOURCE_PREFIX = 'res://';
export const SYSTEM_PREFIX = 'sys://'; export const SYSTEM_PREFIX = 'sys://';
export const FILE_PREFIX = 'file:///';
export function escapeRegexSymbols(source: string): string { export function escapeRegexSymbols(source: string): string {
const escapeRegex = /[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g; const escapeRegex = /[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g;
@@ -85,10 +86,14 @@ export function isFontIconURI(uri: string): boolean {
if (!types.isString(uri)) { if (!types.isString(uri)) {
return false; return false;
} }
return uri.trim().startsWith(FONT_PREFIX);
}
const firstSegment = uri.trim().split('//')[0]; export function isSystemURI(uri: string): boolean {
if (!types.isString(uri)) {
return firstSegment && firstSegment.indexOf('font:') === 0; return false;
}
return uri.trim().startsWith(SYSTEM_PREFIX);
} }
export function isDataURI(uri: string): boolean { export function isDataURI(uri: string): boolean {

View File

@@ -87,6 +87,12 @@ export function mainThreadify(func: Function): (...args: any[]) => void;
*/ */
export function isFontIconURI(uri: string): boolean; export function isFontIconURI(uri: string): boolean;
/**
* Returns true if the specified URI is a system URI like "sys://...".
* @param uri The URI.
*/
export function isSystemURI(uri: string): boolean;
/** /**
* Returns true if the specified path points to a resource or local file. * Returns true if the specified path points to a resource or local file.
* @param path The path. * @param path The path.