2

我正在尝试使用 Nativescript 在操作栏中实现下拉列表导航，但似乎找不到任何有关它的信息。

类似于this和this。

我目前有一个简单的 ActionBar：

    <Page.actionBar>
        <Page.actionBar>
            <ActionBar>
                <ActionBar.actionItems>
                    <ActionItem android.position="actionBar" icon="res://icon" ios.position="right" />
                </ActionBar.actionItems>
            </ActionBar>
        </Page.actionBar>
    </Page.actionBar>

有小费吗？

4

3 回答 3

3

您可以在第一个示例图像中创建 ActionBar，如下所示：

        <Page.actionBar>
        <ActionBar>
            <ActionBar.actionItems>
                <ActionItem android.position="popup" text="Add contact" />
                <ActionItem android.position="popup" text="About" />
            </ActionBar.actionItems>
        </ActionBar>
    </Page.actionBar>

这在Android上看起来不错。我不知道如何使它适用于 iOS。

于 2015-10-02T15:38:20.940 回答
0

我为此使用了 NativeScript DropDown。这是我的 nativescript-angular 模板：

<ActionBar title="Some title" automationText="ActionBar">
    <StackLayout orientation="horizontal"
                 ios:horizontalAlignment="center"
                 android:horizontalAlignment="left">
                    <DropDown #dd
                      [items]="dropDownItems"
                      [selectedIndex]="dropDownSelectedId"
                      (selectedIndexChanged)="onDropDownSelect($event)"
                      class="action-label text-bold"
                      row="1" colSpan="2">
                    </DropDown>
    </StackLayout>
</ActionBar>

希望能帮助到你！

于 2017-04-30T10:32:57.640 回答
0

我使用nativescript-menu为 Android 和 iOS 添加弹出菜单。在您的 HTML 文件中添加以下代码以在操作栏中添加菜单图标。

<ActionBar class="action-bar-container">
<Label text="My Action Bar" class="action-bar-title"></Label>
      <ActionItem class="fas" icon="font://&#xf142;" ios.position="left" id="menuBtn" (tap)="buttonTap()"></ActionItem>
</ActionBar>

请记住在您的打字稿文件中导入库：import { Menu } from "nativescript-menu";

最后在您的打字稿文件中添加以下代码。

  buttonTap() {
    Menu.popup({
      view: this.page.getViewById("menuBtn"),
      actions: ["Example", "NativeScript", "Menu"]
    })
      .then(action => {
        alert(action.id + " - " + action.title);
      })
      .catch(console.log);
  }
于 2021-05-20T16:37:14.617 回答