如何在 NativeScript 中为 iOS 更改突出显示状态的按钮文本颜色？

Posted 2023-04-14

【中文标题】如何在 NativeScript 中为 iOS 更改突出显示状态的按钮文本颜色？

【英文标题】：How to change Button text color in highlighted state for iOS in NativeScript?

【发布时间】：2020-12-31 07:33:41

【问题描述】：

我正在尝试使用 css 在 ios 上将 Button 文本颜色更改为突出显示状态。

尽管我可以更改文本颜色，但似乎也应用了某种不透明度或其他样式，我不知道它是什么或如何覆盖它。

这是Button 在默认状态下的样子：

这是它在突出显示状态下的样子：

我的代码：

.facebookBtn 
  background-color: #3b5998;
  color: #fff;
  &:highlighted 
    color: #fff;
    background-color: darken(#3b5998, 5%);
  

我可以看出颜色参数有效，因为如果我将其更改为 #000 它有效（它也不是黑色，而是某种透明的黑色）。

我尝试过申请opacity: 1;，但没有帮助。不过，它在 android 上也能正常工作。

有什么建议吗？

【问题讨论】：

有同样的问题。你有没有找到解决方案？

@heyman 我最终使用了来自github.com/nativescript-community/ui-material-components的MDButton

谢谢，我找到了一个解决方案，我已将其作为答案发布。

【参考方案1】：

您可以创建一个扩展 Button 的新按钮类，它不会在 iOS 中获得默认的 highlighted/tapped 样式：

import  isIOS, Button  from '@nativescript/core';

export class PlainButton extends Button 
    createNativeView() 
        if (isIOS) 
            return UIButton.buttonWithType(0);
        
        return super.createNativeView();
    

要将其注册为 nativescript-vue 中的全局组件，您可以这样做：

Vue.registerElement("PlainButton", () => PlainButton);