Commit Graph

7 Commits

Author SHA1 Message Date
Adam Comella 863f585be5 iOS: Improve accessibility of multiline TextInputs
Summary:
Fixes #13691.

Prior to this change, VoiceOver generally didn't say anything when selecting a multiline TextInput. The only exception was VoiceOver would announce the TextInput's placeholder if it had one set.

After this change, VoiceOver announces the following for multiline TextInputs:
  - The TextInput's content.
  - The TextInput's placeholder if the TextInput doesn't have any content in it.
  - The fact that the TextInput is a textfield.
  - The cursor position if the TextInput is being edited.

This is similar to the behavior of single line TextInputs.

This change achieves this by disabling `RCTTextView` as an accessibility element. `RCTTextView` is a subclass of `RCTView` so VoiceOver doesn't recognize this as a textfield. Instead, VoiceOver now sees the child `RCTUITextView` which is a subclass of `UITextView` so VoiceOver does recognize it as a textfield. Additionally, an `accessibilityLabel` implementation was added to `RCTUITextView` in order to take the value of the placeholder into account.

Verified the announcements of TextInputs with various props:
  - No placeholder and no content
  - Just a placeholder
  - Just content
  - Both a placeholder and content

Did this for both singe line inputs and multiline inputs. For setting content in multiline inputs, I tested both using the `value` prop and passing children. All other props being equal, these configurations resulted in similar announcements.

I verified that the following accessibility props work the same on singleline and multiline TextInputs:
  - `accessible`
  - `accessibilityLabel`
  - `accessibilityTraits`
  - `accessibilityViewIsModal`
  - `onAccessibilityTap`
  - `onMagicTap`

Additionally, my team has been using this change in our app.

Adam Comella
Microsoft Corp.
Closes https://github.com/facebook/react-native/pull/14200

Differential Revision: D5185727

Pulled By: shergin

fbshipit-source-id: 94271e6c8b089eb82006b52fe7917649d69e74af
2017-06-05 16:15:45 -07:00
Valentin Shergin e13b9c6e49 RCTTextField was spliited into two classes
Summary:
Motivation:
 * We maintain two different implementation of <TextInput> (multilined and singlelined), this change makes the implementations much similar which will help us to support and improve both of them in the (near) future;
 * We have to have separated RCTView-based container view for (TextField) to support sofisticated bordering and so on;
 * It opens to us possibility to unify UITextView and UITextField subclasses and remove code duplication across RCTTextView and RCTTextField;
 * Making things decoupled in general will allow us to fix existing bugs with events.

Reviewed By: mmmulani

Differential Revision: D5083010

fbshipit-source-id: 2f2d42c2244d2b39256c51480c1f16f4e3947c01
2017-05-29 16:01:11 -07:00
Valentin Shergin 48650226e8 Multiline <TextInput> was fixed to match layout logic of singlelined one
Summary: Now padding, border and intinsic sizes are computed same way as for singlelined text input.

Reviewed By: mmmulani

Differential Revision: D5075880

fbshipit-source-id: 1bc2fd479c13a003c717b1fc3d9c69f4639d4444
2017-05-29 16:01:09 -07:00
Valentin Shergin cf975bbd2e Fixed default placeholder text color for multiline <TextInput>
Reviewed By: javache

Differential Revision: D5018823

fbshipit-source-id: 6ad4a1e8d03b6429a436e0cfdd9a127cd5dc1c2b
2017-05-08 11:31:21 -07:00
Valentin Shergin bc1ea548d0 Better TextInput: Simplified focus/first-responder management on iOS
Summary:
Pair `reactWillMakeFirstResponder` and `reactDidMakeFirstResponder` was replaced with just `reactFocus` method
which is supposed to incapsulate all "focus" and "focus-later-if-needed" functionality.

Reviewed By: mmmulani

Differential Revision: D4664626

fbshipit-source-id: 8d3b7935ca26d32ba1d1826a585cce0396fcc885
2017-04-03 15:16:16 -07:00
Valentin Shergin 1433185a09 Improved implementation of placeholer feature in RCTUITextView
Reviewed By: fkgozali

Differential Revision: D4746177

fbshipit-source-id: a8c27ec052b046d4732b14ed081dcaebb44bdaa7
2017-03-21 13:02:22 -07:00
Valentin Shergin b53d76efb7 Better TextInput: RCTUITextView was decoupled in separate file and now handles placeholder feature
Reviewed By: mmmulani

Differential Revision: D4663151

fbshipit-source-id: ce57ca4bebf4676df2ae5e586a1b175ec2aac760
2017-03-20 00:02:58 -07:00