ios – NativeScript TabView上的叠加按钮？

2023年9月2日 231次阅读

我有一个像这样的简单TabView使用NativeScript w / angular：

<TabView [(ngModel)]="tabSelectedIndex" height="300px" (selectedIndexChanged)="onSelectedIndexChanged($event)">
     <StackLayout *tabItem="{title: 'Tab 1'}">
         <Label text="Content in Tab 1"></Label>
    </StackLayout>
     <StackLayout *tabItem="{title: 'Button 1'}">
         <!-- these won't be content here because clicking this should not change to a another tab, but instead should do something else. -->
    </StackLayout>
    <StackLayout *tabItem="{title: 'Tab 2'}">
        <Label text="Content in Tab 2"></Label>
        </StackLayout>
</TabView>

我想在标签栏中有一个按钮,它不会改变视图,而是做其他事情(比如打开一个模态对话框).

我尝试了一个新的< StackLayout> < TabView>的内部和外部.

我也尝试使用< AbsoluteLayout>.所有方法都导致应用程序崩溃.

是否可以使用selectedIndexChanged捕获选项卡视图更改并阻止更改？

我在事件上尝试了stopPropagation()但出现了错误：
类型’SelectedIndexChangedEventData’上不存在属性’stopPropagation’.

我尝试将视图更改回单击中间按钮时存在的视图,但是有一个明显的闪烁,因为视图必须在此事件被触发之前更改.可接受的是类似onSelectedIndexWill Change,但该方法不存在.

 onSelectedIndexChanged(args: SelectedIndexChangedEventData) {
        if (args.newIndex === 1) { //the middle button
            setTimeout(() => {
                tabView.selectedIndex = args.oldIndex; //go back to the previous view (causes flicker)
                //do stuff for the button click.
            });
        }
    }

或者是否有另一种方法可以在标签栏中添加一个不链接到新视图的按钮？

或者我应该不实现本机标签栏,而只是从头创建一个导航栏？

Here’s how it can be done for ios.

Here is a sample app in NativeScript playground showing the issue. Click center link to see the flicker.

最佳答案 事实上,NativeScript团队拒绝了
export the delegates,这不是你可以在这一点上进行补丁的事情.唯一的方法是分叉
TabView代码并使用它创建自己的插件.

但是,一旦获得分叉副本,进行此更改应该相当简单.你只需要在第64行公共tabBarControllerShouldSelectViewController(tabBarController：UITabBarController,viewController：UIViewController)：boolean {

 您只需要检测它正在尝试加载哪个viewController;然后在您不想实际更改视图的情况下返回false. 😉

两种可能的方式;

>检查owner.selectedIndex;我认为此时应指向适当的新指数;
>但是如果不是那么第二种可能的方法是检查viewController对所有者的viewcontroller列表(即const selectedIndex = owner._ios.viewControllers.indexOfObject(viewController);)

点赞