更新

Question

我正在NativeScript-Vue应用程序中实现字体大小的可访问性。
我想允许或禁止通过Android和iOS的XML属性调整Label的大小，但是在平台上的行为和实现是不同的。

Android
默认情况下，所有标签都会缩放。如果我不希望调整标签大小，则需要在this solution之后的setTextSize事件中调用函数loaded。

<Label text="Not resizable" @loaded="$androidFixedLabelSize($event, 70)" />

Vue.prototype.$androidFixedLabelSize = function({ object }, fontSize) {
    if (object.android)
    object.nativeView.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, utils.layout.toDevicePixels(fontSize));
}

iOS
默认情况下，标签不会缩放。要调整标签的大小，我需要使用nativescript-accessibility-ext插件并添加属性accessibilityAdjustsFontSize。

<Label text="Resizable" accessibilityAdjustsFontSize="true" />

必须为固定的Android添加一个属性，为可调整大小的iOS添加一个属性，这有点麻烦。

我当时正在考虑让所有标签默认情况下可调整大小，并指定是否要不通过指令或属性来调整其大小。
我可以通过自定义指令来实现吗？或者是其他东西？

更新

我能够通过不对字体大小进行硬编码的指令来防止在Android上调整大小，但是存在一个问题：update仅针对少数标签触发。 el.nativeView.android和bind挂钩中的inserted未定义。

Vue.directive("noresize", {
    update: el => {
        if (el.nativeView.android) {
            el.nativeView.android.setTextSize(android.util.TypedValue.COMPLEX_UNIT_DIP, el.nativeView.fontSize);
        } else {
            // iOS code
        }
    }
});

在iOS上，我只想设置accessibilityAdjustsFontSize="false"，但这意味着默认情况下它是正确的。

接下来的问题是：如何在iOS的所有Label组件上设置accessibilityAdjustsFontSize="true"？

Answer 1

感谢@nota/nativescript-accessibility-ext的开发人员MortenSjøgren，我能够添加一个全局事件。除非属性noResize为true，否则可调整性的调整大小现已应用于所有Label组件。

app.js

import '@nota/nativescript-accessibility-ext';
import { Label } from 'tns-core-modules/ui/label';

// code

Label.on(Label.loadedEvent, ({ object }) => {
    if (object.noResize) {
        if (object.android) {
            object.nativeView.setTextSize(android.util.TypedValue.COMPLEX_UNIT_DIP, object.fontSize);
        }
    } else {
        object.accessibilityAdjustsFontSize = "true";
    }
 });

<Label text="Don't resize" noResize="true" />

允许/防止标签字体大小调整

更新

1 个答案: