如何在Nativescript angular segmentedBar android中更改选定的选项卡视图指示器颜色

在Nativescript Angular中，要更改选定的选项卡视图指示器颜色，可以通过自定义样式来实现。以下是一种实现方法：

首先，在你的Nativescript Angular项目中，找到对应的样式文件（通常是app.css或者styles.css）。
在样式文件中，添加一个自定义的类，用于修改选项卡视图指示器的颜色。例如：

.selected-indicator {
    background-color: red; /* 这里可以设置你想要的颜色 */
}

在你的组件文件中，导入SegmentedBar组件和ViewContainerRef：

import { Component, ViewChild, ViewContainerRef } from "@angular/core";
import { SegmentedBar } from "tns-core-modules/ui/segmented-bar";

在组件类中，使用ViewChild装饰器获取SegmentedBar的引用，并在选项卡切换时动态添加或移除自定义类。例如：

@Component({
    selector: "app-segmented-bar",
    templateUrl: "./segmented-bar.component.html",
    styleUrls: ["./segmented-bar.component.css"]
})
export class SegmentedBarComponent {
    @ViewChild("segmentedBar", { static: false }) segmentedBar: ElementRef<SegmentedBar>;

    constructor(private viewContainerRef: ViewContainerRef) {}

    onSelectedIndexChanged(args) {
        const segmentedBar = this.segmentedBar.nativeElement;
        const selectedIndex = segmentedBar.selectedIndex;

        // 移除所有选项卡的自定义类
        segmentedBar.eachChildView((child) => {
            child.viewContainerRef.nativeElement.classList.remove("selected-indicator");
            return true;
        });

        // 添加选中选项卡的自定义类
        const selectedTab = segmentedBar.items[selectedIndex];
        selectedTab.viewContainerRef.nativeElement.classList.add("selected-indicator");
    }
}

在HTML模板中，使用ngClass指令绑定自定义类。例如：

<SegmentedBar #segmentedBar (selectedIndexChange)="onSelectedIndexChanged($event)">
    <SegmentedBarItem title="选项卡1"></SegmentedBarItem>
    <SegmentedBarItem title="选项卡2"></SegmentedBarItem>
    <SegmentedBarItem title="选项卡3"></SegmentedBarItem>
</SegmentedBar>

通过以上步骤，你可以在Nativescript Angular中更改选定的选项卡视图指示器的颜色。请注意，这只是一种实现方法，你可以根据自己的需求进行调整和扩展。

关于Nativescript和Angular的更多信息，你可以参考腾讯云的相关产品和文档：