javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-14 01:43:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ios): added activity indicator iosIndicatorViewStyle property (#10650)

Browse Source
This commit is contained in:
Dimitris-Rafail Katsampas
2025-02-18 08:36:25 +02:00
committed by GitHub
parent e853fca3c9
commit adaa796bda
3 changed files with 39 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/core/ui/activity-indicator/activity-indicator-common.ts
View File

@ -1,4 +1,4 @@
import { ActivityIndicator as ActivityIndicatorDefinition } from '.';
import { ActivityIndicator as ActivityIndicatorDefinition, IOSIndicatorViewStyle } from '.';
import { View, CSSType } from '../core/view';
import { booleanConverter } from '../core/view-base';
import { Property } from '../core/properties';
@ -6,6 +6,7 @@ import { Property } from '../core/properties';
@CSSType('ActivityIndicator')
export class ActivityIndicatorBase extends View implements ActivityIndicatorDefinition {
public busy: boolean;
public iosIndicatorViewStyle: IOSIndicatorViewStyle;
}
ActivityIndicatorBase.prototype.recycleNativeView = 'auto';
@ -16,3 +17,9 @@ export const busyProperty = new Property<ActivityIndicatorBase, boolean>({
valueConverter: booleanConverter,
});
busyProperty.register(ActivityIndicatorBase);
export const iosIndicatorViewStyleProperty = new Property<ActivityIndicatorBase, IOSIndicatorViewStyle>({
name: 'iosIndicatorViewStyle',
defaultValue: 'medium',
});
iosIndicatorViewStyleProperty.register(ActivityIndicatorBase);

7
packages/core/ui/activity-indicator/index.d.ts vendored
View File

@ -1,5 +1,7 @@
import { View } from '../core/view';
export type IOSIndicatorViewStyle = 'medium' | 'large';
/**
* Represents a UI widget which displays a progress indicator hinting the user for some background operation running.
*
@ -22,4 +24,9 @@ export class ActivityIndicator extends View {
* @nsProperty
*/
busy: boolean;
/**
* Gets or sets the iOS indicator view style (e.g. medium, large).
*/
iosIndicatorViewStyle: IOSIndicatorViewStyle;
}

33
packages/core/ui/activity-indicator/index.ios.ts
View File

@ -1,7 +1,8 @@
import { ActivityIndicatorBase, busyProperty } from './activity-indicator-common';
import { ActivityIndicatorBase, busyProperty, iosIndicatorViewStyleProperty } from './activity-indicator-common';
import { colorProperty } from '../styling/style-properties';
import { Color } from '../../color';
import { iOSNativeHelper } from '../../utils';
import { IOSIndicatorViewStyle } from '.';
export * from './activity-indicator-common';
@ -10,10 +11,8 @@ const majorVersion = iOSNativeHelper.MajorVersion;
export class ActivityIndicator extends ActivityIndicatorBase {
nativeViewProtected: UIActivityIndicatorView;
private _activityIndicatorViewStyle = majorVersion <= 12 || !UIActivityIndicatorViewStyle.Medium ? UIActivityIndicatorViewStyle.Gray : UIActivityIndicatorViewStyle.Medium;
createNativeView() {
const viewStyle = this._activityIndicatorViewStyle;
const viewStyle = this._getNativeIndicatorViewStyle(this.iosIndicatorViewStyle);
const view = UIActivityIndicatorView.alloc().initWithActivityIndicatorStyle(viewStyle);
view.hidesWhenStopped = true;
@ -25,15 +24,27 @@ export class ActivityIndicator extends ActivityIndicatorBase {
return this.nativeViewProtected;
}
[busyProperty.getDefault](): boolean {
if ((<any>this.nativeViewProtected).isAnimating) {
return (<any>this.nativeViewProtected).isAnimating();
} else {
return this.nativeViewProtected.animating;
private _getNativeIndicatorViewStyle(value: IOSIndicatorViewStyle): UIActivityIndicatorViewStyle {
let viewStyle: UIActivityIndicatorViewStyle;
switch (value) {
case 'large':
viewStyle = majorVersion > 12 ? UIActivityIndicatorViewStyle.Large : UIActivityIndicatorViewStyle.WhiteLarge;
break;
default:
viewStyle = majorVersion > 12 ? UIActivityIndicatorViewStyle.Medium : UIActivityIndicatorViewStyle.Gray;
break;
}
return viewStyle;
}
[busyProperty.getDefault](): boolean {
return this.nativeViewProtected.animating;
}
[busyProperty.setNative](value: boolean) {
const nativeView = this.nativeViewProtected;
if (value) {
nativeView.startAnimating();
} else {
@ -51,4 +62,8 @@ export class ActivityIndicator extends ActivityIndicatorBase {
[colorProperty.setNative](value: UIColor | Color) {
this.nativeViewProtected.color = value instanceof Color ? value.ios : value;
}
[iosIndicatorViewStyleProperty.setNative](value: IOSIndicatorViewStyle) {
this.nativeViewProtected.activityIndicatorViewStyle = this._getNativeIndicatorViewStyle(value);
}
}