Nativescript自定义搜索栏

Question

无论如何，

是否可以自定义NativeScript提供的搜索栏元素？ 并在其中添加一些按钮。

我想尝试这样的东西（这个应用程序中的搜索栏）

我一直在搜索，但一无所获。

Answer 1

此处的基本演示：https://play.nativescript.org/?template=play-vue&id=y6iFw9

您始终可以使用actionBarHidden="true元素上的<page>隐藏默认操作栏，然后创建自己的操作栏。在这种情况下，您可以使用GridLayout并将每个元素放在自己的列中。像这样：

<Page actionBarHidden="true>
<StackLayout>
  <GridLayout rows="auto columns="auto, *, auto, auto, auto>
   <Label col="0 text="Menu"/>
   <TextField col="1></TextField>
   <Label col="2 text="icon1"/>
   <Label col="3 text="icon2"/>
   <Label col="4 text="icon3"/>
  </GridLayout>
</StackLayout>
</Page>

只需用图标替换标签，并在按下图标时添加@tap="yourFunction即可触发。要将标签变成图标，可以使用Fonticon之类的软件包。

Answer 2

来自tns-core-modules的搜索栏无法提供您所需的内容（请参阅https://docs.nativescript.org/api-reference/modules/_ui_search_bar_处的API）。我建议你自己实现这个组件。