Can You Change Buttons color onfocuse In Nativescript/Angular

[thisiseddy-ab]

Can You Change Buttons color onfocused like yout do in TextField In Nativescript/Angular.. It works in TextField but not in BUTTON Does someone knows some other solution, im trying to build a tvapp i need to change the color when is focused in Button or Label

My StackOverflow Question
https://stackoverflow.com/questions/70513009/can-you-change-buttons-color-onfocuse-in-nativescript-angular
https://stackoverflow.com/questions/70555555/listen-to-focuschange-in-ios-tvos-for-nativescript-angular

<Page loaded="onPageLoaded($event)"> <StackLayout> <Button text="My Button 2" class="my_button_2" > </Button> <TextField class="input-field"> </TextField> </StackLayout> </Page>

`
.my_button_2:focus{
background:olive;
border-color: red;
border: 2;
border-width: 2;
}

.my_button_2:active{
background:olive;
border-color: red;
border: 2;
border-width: 2;
}

.input-field:focus {
border-bottom-color: red;
`

[thisiseddy-ab]

Here is the solution in Android onloaded event

######## HTML ######################
<Button #myButton1 text="My Button 1" (tap)="OnTapButton_1($event)" (loaded)="onButtonLoaded_1($event)" class="button_style"></Button>
######## Component.ts File #############

public onButtonLoaded_1(args) {
    let btn = args.object as Button;
    let androidButton = btn.android;

    androidButton.setOnFocusChangeListener(new android.view.View.OnFocusChangeListener({
      onFocusChange:(view, hasFocus) => {
          if(hasFocus === true){
            btn.addPseudoClass("focus")
          }
          else {
            btn.deletePseudoClass("focus")

          }
        }
      }))
}

######## CSS #################

.button_style {
    android-elevation: 0;
    android-dynamic-elevation-offset: 0;
    background: rgba(190, 138, 17, 0.315);
    border-width: 0.3;
    border-color: rgba(190, 138, 17, 0.671);

}

.button_style:focus{
    android-elevation: 0;
    android-dynamic-elevation-offset: 0;
    background: rgba(190, 138, 17, 0.856);
    border-width: 0.3;
    border-color: rgba(116, 84, 11, 0.856);
}

Disbaling in it

androidButton.setOnFocusChangeListener(null)

[thisiseddy-ab]

Does someone has any idea how to do the same thing in IOS

I think this is how you do it with UIFocusUpdateContext

https://developer.apple.com/documentation/uikit/uifocusupdatecontext

Does someone know how to do this in typesctipt ? In Swift (tvOS) how do you change a UIButton's highlight and focus colors?

I think this is the typescript function , but i don't know how to override it

public onButtonLoaded_1(args) { let btn = args.object as Button; let iosButton= btn.ios as UIButton iosButton.didUpdateFocusInContextWithAnimationCoordinator() }
#######################################################################
Maybe this way could be done with UIControl.Event

There is a "focused" property in IOS can i someone listen when it chnages ? I dont understand Objective C at all maybe someone can Help me.

public onButtonLoaded_1(args) { let btn = args.object as Button; let iosButton= btn.ios as UIButton iosButton.focused }

https://developer.apple.com/documentation/uikit/uicontrol

https://developer.apple.com/documentation/uikit/uicontrol/event

valueChanged

https://developer.apple.com/documentation/uikit/uicontrol/event/1618238-valuechanged