ランタイムにFormattedStringを持つボタンのテキストの色を変更するにはどうすればよいですか？

Question

は、私は、次の構造を有する：

<Button class="but_border but_text bluebg" flexGrow="1" #lol2> 
    <FormattedString> 
     <Span text="&#xf230;" fontFamily="FontAwesome, fontawesome-webfont" fontSize="20"></Span> 
     <Span text=" Identifícate con Facebook" ></Span> 
    </FormattedString> 
</Button> 

私にこの与える：

Screen Capture of the Button

をそして、それは確かに私はそれが望むように見えます。しかし、私のボタンには、背景色とフォント色の変更を加えたCSSの状態が必要です。

.but { 
    color: white; 
} 

.but:pressed { 
    color: red; 
} 

を私はFormattedStringを使用いけない場合、それは動作しますが、私がしなければ、それだけで最初のレンダリングに取り組んでいます：

この使用してCSSをこの方法を行うには些細なことする必要があります。その後、それはどんなイベントでも変更されません。あるいはクラスやXMLやCSSのプロパティを手で変更しても、レンダリングは決して更新されません。

私はAndroidのボタン内のすべてのテキストを大文字にすることを避けるために私が知っている唯一の方法であるため、FormattedStringを使用しています。私はそれを避けるためにテキストデコレータを使用しようとしましたが、私は大文字小文字、またはTitleizeすることしかできませんが、FormattedStringを使用しない限り、テキストをちょうどそのまま残すことはできません！

私はFormattedStringを使用していますもう一つは、テキストに異なるフォントを埋め込むことです（私はこの例でFontAwesomeアイコンを使用しています）

Answer 1

FormattedString属性のそれ自身のセットを持っています。

たとえば、この場合はforegroundColorです。多くの多くの試行の後

Documentation

Answer 2

は、これは私が物事を成し遂げると上を移動するために管理方法ですが、これを引き出します。それでも私は（悲しいことに）私が探している答えではありません。

私はボタンこのXMLのためのXML交換しました：あなたは気づくことのよう

<GridLayout columns="auto" rows="auto" class="button_grid"> 
    <Button class="but_border but_text bluebg pressed"> 
    <FormattedString> 
     <Span text="&#xf230;" fontFamily="FontAwesome, fontawesome-webfont" fontSize="20"></Span> 
     <Span text=" Identifícate con Facebook" ></Span> 
    </FormattedString> 
    </Button> 
    <Button class="but_border but_text bluebg"> 
    <FormattedString> 
     <Span text="&#xf230;" fontFamily="FontAwesome, fontawesome-webfont" fontSize="20"></Span> 
     <Span text=" Identifícate con Facebook" ></Span> 
    </FormattedString> 
    </Button> 
</GridLayout> 

を、私は（同じCOLと行を使用して）2つの同一のボタンに他の上で1つに重なるのGridLayoutを使用して、 CSSを使用して、私はその上のボタンを非表示にします。また、追加の.pressedクラスを下のボタンに追加しました。これにより、ユーザがボタンを押したときに私のボタンを見たいようにスタイルを設定できます。

私はこれをきれいなソリューションとは考えていませんが、解決策です。誰かが何か良いものを思いつくまでこれはしなければならないでしょう。それがこのように残っているなら、私はNativescript githubに関する問題を開き、ネイティブの解決策を取り、PRを試みるべきだと思います。

私は、これは他の誰かのために有用であることを願って...私は以下の私のCSSを残します：

.button_grid { 
    margin: 5; 
    flex-grow: 1; 
} 
.but_text{ 
    font-size:14 
    border-color:rgba(255, 0, 0, 0.0); 
    border-width: 1; 
    color: white; 
    height: 45; 
} 
.but_border { 
    border-radius: 50%; 
    border-width: 0; 
    border-color: transparent; 
    width: 100%; 
} 
.but_border:pressed {   /* I use this to hide the topmost */ 
    visibility: collapse;  /* button on :pressed state  */ 
} 
.but_border.bluebg { 
    background-color: #007aff; 
} 
.but_border.bluebg.pressed { /* I use this to style the bottom */ 
    background-color: #004999; /* button (visible when pressed) */ 
} 

をそれはちょうどその横にコメントを読んで、:pressedと.pressedの違いに気づくことが重要です。