时间戳

首页 > 解决方案 > 如何在 iOS 的 ActionBar 上调整图像大小

nativescript - 如何在 iOS 的 ActionBar 上调整图像大小

问题描述

我有 ActionBar 的以下代码

<ActionBar title="" class="action-bar">
    <NavigationButton
        (tap)="toggleDrawer()"
        class="action-bar-item"
        ios:visibility="collapsed" 
        icon="res://menu">
    </NavigationButton>
    <ActionItem 
        icon="res://menu" 
        android:visibility="collapsed" 
        (tap)="toggleDrawer()" 
        ios.position="left">
    </ActionItem>
    <StackLayout class="action-item" android:horizontalAlignment="center" ios:horizontalAlignment="center">
        <Image src="res://ideas_wt_full" width="60%" height="60%" [visibility]="android ? 'visible' : 'collapsed'"></Image>
        <Image src="res://ideas_wt_full" width="30%" height="30%" stretch="aspectFill" [visibility]="!android ? 'visible' : 'collapsed'"></Image>
    </StackLayout>
    <ActionItem android.systemIcon="ic_menu_search" ios.systemIcon="12" ios.position="right"></ActionItem>
</ActionBar>

在 Android 上一切都很好，但在 iOS 上，图像以全分辨率显示，因此对于 ActionBar 来说太大了。

任何帮助表示赞赏！

标签： nativescriptangular2-nativescriptnativescript-angular

解决方案

我修复了为宽度和高度设置固定值的问题。所以我为图像创建了一个类并在 css 中设置了这些属性。此外，我必须小心 iOS 上的高度，因为由于 ActionBar 样式的限制，它不会改变操作栏的高度，我需要将高度设置为 80px。

推荐阅读