akveo / react-native-ui-kitten

:boom: React Native UI Library based on Eva Design System :new_moon_with_face::sparkles:Dark Mode
https://akveo.github.io/react-native-ui-kitten/
MIT License
10.3k stars 952 forks source link

Button doesn't have the focus method #1620

Open SuperKXT opened 2 years ago

SuperKXT commented 2 years ago

πŸ› Bug Report

The Button component can not be focused on programmatically. The focus method is not available. The Button uses TouchableOpacity which does have a focus method.

To Reproduce

Steps to reproduce the behavior:

  1. Assign a ref to a button.
  2. Try to focus the button programmatically.

Expected behavior

The expected behavior would be to have the focus method available on the component.

Link to runnable example or repository (highly encouraged)

snack demo

UI Kitten and Eva version

Package Version
@eva-design/eva 2.1.1
@ui-kitten/components 5.1.2

Environment information

  System:
    OS: Linux 5.17 Pop!_OS 22.04 LTS
    CPU: (8) x64 Intel(R) Xeon(R) CPU E5-1620 v2 @ 3.70GHz
  Binaries:
    Node: 16.13.1 - ~/.nvm/versions/node/v16.13.1/bin/node
    Yarn: 1.22.18 - ~/.nvm/versions/node/v16.13.1/bin/yarn
    npm: 8.10.0 - ~/.nvm/versions/node/v16.13.1/bin/npm
  npmPackages:
    react: 17.0.2 => 17.0.2 
    react-native: 0.68.2 => 0.68.2 
  npmGlobalPackages:
    react-native-cli: 2.0.1
greenfrvr commented 1 year ago

@SuperKXT can you please describe the use case when you trigger focus method? I know we don't pass ref to TouchableOpacity, that's why it's not working. I'm just interested is it used on web or on mobile?

SuperKXT commented 1 year ago

It is used on mobile. As this was a while ago, I can not recall the exact problem I was trying to solve.

greenfrvr commented 1 year ago

I just tried your example, it seems that method focus is presented on all platforms (if cases works fine), but it actually works only on web, e.i. nothing happens when calling it on mobile. on my sample project it even causes crashes.

Do you still have an issue with this functionality?

SuperKXT commented 1 year ago

I don't understand what you mean. It works on TouchableOpacity, but not on Button.I have tweaked the example so it actually calls the focus method for both TouchableOpacity and Button. It seems to be crashing on button presses on all platforms.

greenfrvr commented 1 year ago

I've checked the example one more time. I added onFocus listener to TouchableOpacity and after calling focus method via ref onFocus callback was called only on web. That what I meant. focus method is presented on JS side, but it seems to be it is not implemented for native mobile platforms for TouchableOpacity component. what was your use case of using focus method? I'm asking because for now it seems TouchableOpacity component doesn't provide working functionality for focus method on mobile platforms (despite it is presented in JS interface). just want to understand what problem we're trying to solve before making any changes

SuperKXT commented 1 year ago

If I remember correctly I was trying to focus the submit button if you press next on the last form input.