React-native: NullPointerException: tentação de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)'

Enfrentando o mesmo problema.

Mesmo aqui [email protected]

com.facebook.react.views.textinput.ReactEditText.onTouchEvent
ReactEditText.java - line 163
java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
1
android.graphics.drawable.DrawableContainer$DrawableContainerState.getChild DrawableContainer.java:884
2
android.graphics.drawable.DrawableContainer.selectDrawable DrawableContainer.java:466
3
android.graphics.drawable.StateListDrawable.onStateChange StateListDrawable.java:104
4
android.graphics.drawable.Drawable.setState Drawable.java:736
5
android.graphics.drawable.DrawableWrapper.onStateChange DrawableWrapper.java:331
6
android.graphics.drawable.Drawable.setState Drawable.java:736
7
android.view.View.drawableStateChanged View.java:19223
8
android.widget.TextView.drawableStateChanged TextView.java:4673
9
android.view.View.refreshDrawableState View.java:19292
10
android.view.View.setPressed View.java:9135
11
android.view.View.setPressed View.java:9113
12
android.view.View.onTouchEvent View.java:12357
13
android.widget.TextView.onTouchEvent TextView.java:10095
14
com.facebook.react.views.textinput.ReactEditText.onTouchEvent ReactEditText.java:163

O mesmo problema

O mesmo problema. Mesmo logtrace

O mesmo aqui no RN 44.0

+1 anotha 'um

Pessoal, reiniciar o empacotador e limpar o cache funcionou para mim!

O mesmo problema para mim. Estou usando RN 0.51.0 e react-native-material-textfield 0.12.0.

Eu também estou enfrentando esses problemas. O estranho é que é muito difícil rastrear o erro, pois o rastreamento da pilha não contém nenhuma informação útil. Nem sei onde pode estar o erro.
Será atualizado aqui se eu encontrar a solução

Mesmo erro acontecendo em RN 0.52.0.

Obrigado por postar isso! Parece que você não está usando a versão mais recente do React Native, v0.53.0, lançado em janeiro de 2018. Você pode ter certeza de que este problema ainda pode ser reproduzido na versão mais recente?

Vou encerrar isso, mas sinta-se à vontade para abrir um novo problema se puder confirmar que esse ainda é um problema na v0.53.0 ou mais recente.

_{Como contribuir • O que esperar dos mantenedores}

Mesmo problema em 0.53.3

O mesmo problema

@ react-native-bot Precisa reabrir o problema

enfrentando o mesmo problema com o Android 8

O mesmo aqui. React nativo 0.53.3, SM-T550, API de nível 25 (Android 7.0)

esse problema acabou de surgir comigo, React nativo 0.53.3 - Android 8.1.

React nativo 0.53.3, android 8, mesmo problema

Mesmo problema, react-native 0.53.0 e android 8. É estranho porque este erro parece aparecer aleatoriamente. Não consigo encontrar nenhuma etapa exata para reproduzi-lo.

Tenha um aplicativo de produção executando RN 0.54.2 e isso parece afetar alguns usuários executando o Android 8.0.0 na inicialização do aplicativo.

Por que este problema foi encerrado? Alguns de nós estão enfrentando esse problema no ambiente de produção, portanto, "reiniciar o empacotador" não é uma solução aceitável.

Este problema precisa ser reaberto, pois afeta a versão atual.

Também estou enfrentando rastreamentos de pilha que podem estar relacionados:

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
       at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
       at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
       at android.view.View.computeOpaqueFlags(View.java:16791)
       at android.view.View.setBackgroundDrawable(View.java:21710)
       at android.view.View.setBackground(View.java:21603)
       at android.view.View.<init>(View.java:5547)
       at android.widget.TextView.<init>(TextView.java:1135)
       at android.widget.EditText.<init>(EditText.java:107)
       at android.widget.EditText.<init>(EditText.java:103)
       at android.widget.EditText.<init>(EditText.java:99)
       at android.widget.EditText.<init>(EditText.java:95)
       at com.facebook.react.views.textinput.ReactEditText.<init>(ReactEditText.java:92)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:94)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:65)
       at com.facebook.react.uimanager.ViewManager.createView(ViewManager.java:46)
       at com.facebook.react.uimanager.NativeViewHierarchyManager.createView(NativeViewHierarchyManager.java:218)
       at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute(UIViewOperationQueue.java:150)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.dispatchPendingNonBatchedOperations(UIViewOperationQueue.java:923)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:895)
       at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:31)
       at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:136)
       at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:107)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:909)
       at android.view.Choreographer.doCallbacks(Choreographer.java:723)
       at android.view.Choreographer.doFrame(Choreographer.java:655)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:897)
       at android.os.Handler.handleCallback(Handler.java:789)
       at android.os.Handler.dispatchMessage(Handler.java:98)
       at android.os.Looper.loop(Looper.java:164)
       at android.app.ActivityThread.main(ActivityThread.java:6938)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.Zygote$MethodAndArgsCaller.run(Zygote.java:327)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1374)

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.DrawableContainer$DrawableContainerState$ConstantStateFuture.get(android.graphics.drawable.DrawableContainer$DrawableContainerState)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getChild(DrawableContainer.java:823)
       at android.graphics.drawable.DrawableContainer.selectDrawable(DrawableContainer.java:452)
       at android.graphics.drawable.StateListDrawable.onStateChange(StateListDrawable.java:104)
       at android.graphics.drawable.Drawable.setState(Drawable.java:680)
       at android.graphics.drawable.DrawableWrapper.onStateChange(DrawableWrapper.java:279)
       at android.graphics.drawable.Drawable.setState(Drawable.java:680)
       at android.graphics.drawable.LayerDrawable.onStateChange(LayerDrawable.java:1381)
       at android.graphics.drawable.Drawable.setState(Drawable.java:680)
       at android.view.View.drawableStateChanged(View.java:17003)
       at android.widget.TextView.drawableStateChanged(TextView.java:3984)
       at android.view.View.refreshDrawableState(View.java:17067)
       at android.view.View.setPressed(View.java:7914)
       at android.view.View.setPressed(View.java:7892)
       at android.view.View.access$2900(View.java:708)
       at android.view.View$CheckForTap.run(View.java:21187)
       at android.os.Handler.handleCallback(Handler.java:739)
       at android.os.Handler.dispatchMessage(Handler.java:95)
       at android.os.Looper.loop(Looper.java:148)
       at android.app.ActivityThread.main(ActivityThread.java:5451)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)

@grabbou podemos reabrir este problema?

Mesmo problema aqui android 8.0 api 26

O mesmo em 0.54.2.

Eu reduzi para <TextInput> sendo renderizado em uma FlatList. Quando eu substituo isso por <Text> , o problema desaparece.

Reproduza com a última versão disponível agora e irei reabri-la.

O mesmo aqui @ radko93

Android 8.1 API 27

"dependências": {
"react": "16.3.1",
"reagir nativo": "0.55.1",
"react-native-linear-gradient": "^ 2.4.0",
"react-native-vector-icons": "^ 4.6.0",
"react-navigation": "^ 1.5.11"
},

Tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
createAllFutures
DrawableContainer. java: 875
getOpacity
DrawableContainer. java: 1158
getOpacity
DrawableContainer. java: 433
getOpacity
InsetDrawable. java: 258
computeOpaqueFlags
Visão. java: 15698
setBackgroundDrawable
Visão. java: 20502
setBackground
Visão. java: 20395

Visão. java: 5238

TextView. java: 826

Editar texto. java: 88

Editar texto. java: 84

Editar texto. java: 80

Editar texto. java: 76
setThemedContext
ReactTextInputShadowNode. java: 80
createView
UIImplementation. java: 282
createView
UIManagerModule. java: 366
invocar
Method.java
invocar
JavaMethodWrapper. java: 372
invocar
JavaModuleWrapper. java: 160
corre
NativeRunnable.java
handleCallback
Handler. java: 790
dispatchMessage
Handler. java: 99
dispatchMessage
MessageQueueThreadHandler. java: 29
ciclo
Looper. java: 164
corre
MessageQueueThreadImpl. java: 192
corre
Fio. java: 764

O mesmo problema

package.json
"dependências": {
"react": "16.3.1",
"reagir nativo": "0.55.2",
},

build.gradle
compileSdkVersion 26
buildToolsVersion "26.0.2"
minSdkVersion 16

O mesmo problema.

java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
    at android.graphics.drawable.DrawableContainer$DrawableContainerState.getChild(DrawableContainer.java:888)
    at android.graphics.drawable.DrawableContainer.selectDrawable(DrawableContainer.java:466)
    at android.graphics.drawable.StateListDrawable.onStateChange(StateListDrawable.java:104)
    at android.graphics.drawable.Drawable.setState(Drawable.java:735)
    at android.graphics.drawable.DrawableWrapper.onStateChange(DrawableWrapper.java:331)
    at android.graphics.drawable.Drawable.setState(Drawable.java:735)
    at android.view.View.drawableStateChanged(View.java:18038)
    at android.widget.TextView.drawableStateChanged(TextView.java:4108)
    at android.view.View.refreshDrawableState(View.java:18107)
    at android.view.View.setPressed(View.java:8536)
    at android.view.View.setPressed(View.java:8514)
    at android.view.View.onTouchEvent(View.java:11262)
    at android.widget.TextView.onTouchEvent(TextView.java:8489)
    at com.facebook.react.views.textinput.ReactEditText.onTouchEvent(ReactEditText.java:162)
    at android.view.View.dispatchTouchEvent(View.java:10054)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at android.view.ViewGroup.dispatchTransformedTouchEvent(ViewGroup.java:2663)
    at android.view.ViewGroup.dispatchTouchEvent(ViewGroup.java:2336)
    at com.android.internal.policy.DecorView.superDispatchTouchEvent(DecorView.java:432)
    at com.android.internal.policy.PhoneWindow.superDispatchTouchEvent(PhoneWindow.java:1841)
    at android.app.Activity.dispatchTouchEvent(Activity.java:3233)
    at com.android.internal.policy.DecorView.dispatchTouchEvent(DecorView.java:394)
    at android.view.View.dispatchPointerEvent(View.java:10286)
    at android.view.ViewRootImpl$ViewPostImeInputStage.processPointerEvent(ViewRootImpl.java:4514)
    at android.view.ViewRootImpl$ViewPostImeInputStage.onProcess(ViewRootImpl.java:4370)
    at android.view.ViewRootImpl$InputStage.deliver(ViewRootImpl.java:3883)
    at android.view.ViewRootImpl$InputStage.onDeliverToNext(ViewRootImpl.java:3953)
    at android.view.ViewRootImpl$InputStage.forward(ViewRootImpl.java:3911)
    at android.view.ViewRootImpl$AsyncInputStage.forward(ViewRootImpl.java:4053)
    at android.view.ViewRootImpl$InputStage.apply(ViewRootImpl.java:3919)
    at android.view.ViewRootImpl$AsyncInputStage.apply(ViewRootImpl.java:4110)
    at android.view.ViewRootImpl$InputStage.deliver(ViewRootImpl.java:3883)
    at android.view.ViewRootImpl$InputStage.onDeliverToNext(ViewRootImpl.java:3953)
    at android.view.ViewRootImpl$InputStage.forward(ViewRootImpl.java:3911)
    at android.view.ViewRootImpl$InputStage.apply(ViewRootImpl.java:3919)
    at android.view.ViewRootImpl$InputStage.deliver(ViewRootImpl.java:3883)
    at android.view.ViewRootImpl.deliverInputEvent(ViewRootImpl.java:6359)
    at android.view.ViewRootImpl.doProcessInputEvents(ViewRootImpl.java:6333)
    at android.view.ViewRootImpl.enqueueInputEvent(ViewRootImpl.java:6288)
    at android.view.ViewRootImpl$WindowInputEventReceiver.onInputEvent(ViewRootImpl.java:6469)
    at android.view.InputEventReceiver.dispatchInputEvent(InputEventReceiver.java:193)
    at android.os.MessageQueue.nativePollOnce(Native Method)
    at android.os.MessageQueue.next(MessageQueue.java:323)
    at android.os.Looper.loop(Looper.java:136)
    at android.app.ActivityThread.main(ActivityThread.java:6295)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:900)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:790)

Android: 7.1.1
React-Native ： 0.48.3

O mesmo problema.

mesmo problema, no ambiente de produção, meu dispositivo é HUAWEI (LLD-AL10) 8.0.0, estou usando atualmente o React Native 0.46.2, obrigado

Obtendo o mesmo problema ao usar a versão mais recente do react-native (0.55.3). O problema parece estar relacionado a TextInput em uma FlatList, conforme mencionado acima. Obtendo o erro no Android 8.0 e 8.1. Alguma solução alternativa para evitar esse problema?

Posso reproduzir esse bug criando um novo projeto React Native com init react-native e alterando o App.js para

import React, { Component } from 'react';
import {
  StyleSheet,
  TextInput,
  View
} from 'react-native';

type Props = {};
export default class App extends Component<Props> {
  render() {
    const inputs = Array.apply(null, Array(256)).map((_, i) => i)
    return (
      <View>
        {inputs.map(i => <TextInput key={i} />)}
      </View>
    );
  }
}

Eu estava executando isso em um Galaxy S8 com Android 8.0.0 do MacOS 10.13.3.

"dependencies": {
    "react": "16.3.1",
    "react-native": "0.55.3"
},

Não sei se o erro não está diretamente ligado ao número de TextInputs, mas essa é a única maneira de reproduzir esse bug de maneira bastante confiável. Com 128 entradas, não obtive esse erro em todas as reinicializações, mas depois de algumas recargas ele apareceu. Com 256 TextInputs vazios, acho que não consegui iniciar o aplicativo sem obter o erro. Também percebi que adicionar elementos entre TextInputs parecia reduzir a probabilidade de obter esse erro, portanto, provavelmente não está diretamente vinculado ao número de TextInputs. Eu tentei isso em meu aplicativo atual e adicionar centenas de TextInputs à tela inicial também desencadeou esse erro, mas minhas outras visualizações com quantidades semelhantes de TextInputs envoltos em outros elementos não parecem sempre desencadear esse erro, pois tenho alguns em meu aplicativo .

Eu tenho o mesmo problema. Eu estava executando isso em um Huawei P10 com Android 8.0.0.
"react": "^16.2.0", "react-native": "^0.55.0",
Captura de tela

Parece que o problema está nos TextInputs. Isso acontece no meu Huawei P10 (Android 8.0.0). Já existe uma solução para isso?

Android: 7.1.1
"reagir nativo": "0.53.3",

Obrigado por postar isso! Parece que seu problema pode se referir a uma versão mais antiga do React Native. Você pode reproduzir o problema na versão mais recente, v0.55 ?

Obrigado por suas contribuições.

Estou enfrentando o mesmo problema. Está relacionado ao componente TextInput. Mesmo um único TextInput sendo renderizado em uma tela está causando esse erro. Existem soluções alternativas?

reagente nativo: 0,55
reagir: 16.3.1

Eu mudo o construtor ReactEditText “super“, parece que não vai acontecer,
mas comente “underlineColorAndroid”
https://github.com/yuanboGeng/react-native/commit/36f7949f9a3e9c1f3b10df43a9f495f9f8712a1f
reagente nativo: 0.53.3
reagir: 16.2.0

Isso começou a acontecer para mim depois de atualizar meu emulador para a API de nível 26 a partir da API de nível 21

Eu tive esse erro aparecendo sem motivo durante o desenvolvimento. Limpei minhas pastas / build e executei run-android novamente. O problema desapareceu. Muito estranho. Espero que para alguns de vocês uma construção limpa resolva isso.

Tendo esse mesmo problema. Uma pequena diferença - na minha, estou aninhando TextInputs dentro de um VirtualizedList (o pai de FlatList) e só recebo o problema quando começo a rolar a lista nessa lista, mesmo assim obtendo apenas intermitentemente, em vez de o tempo todo. Da mesma forma que outros, isso está acontecendo em um ambiente de produção, portanto, reiniciar o empacotador não é uma opção.

Com base em algumas pesquisas, parece estar relacionado a um problema antigo no próprio Android: https://issuetracker.google.com/issues/37068452
Se esse for o problema subjacente, isso seria resolvido apenas atualizando o compileSdk e as versões da biblioteca de suporte no projeto RN. Não faço ideia do LoE sobre isso, no entanto.

Atualização: tentar forçar os subprojetos a usar uma versão superior das ferramentas de compilação e compileSdk não resolveu esse problema para o meu projeto, conforme explicado neste post do SO . Não tenho certeza se eu apenas apliquei essas versões superiores de forma errada, se minha configuração de compilação não está tratando o RN como um subprojeto dessa forma ou se realmente não foi uma solução válida para o problema aqui.

EDIT 2: Parece que ReactEditText nem mesmo está usando a versão da biblioteca de suporte do EditText (que seria AppCompatEditText), o que explica por que a atualização da biblioteca de suporte não fez nada. Estou olhando para isso - vai demorar mais algumas atualizações do que apenas alterar a herança para fazer isso funcionar, mas _pode_ ser a solução certa para este problema.

EDIT 3: Não era a solução. Não tenho mais certeza de que esse problema seja o mesmo do AOSP vinculado.
Posso dizer que não parece importar em que tipo de ScrollView você colocou seu texto - consegui reproduzir em VirtualizedList e ScrollView, e muitos neste tópico fizeram isso com uma FlatList.

eu tenho esse mesmo em produção

Eu também estou enfrentando esse problema. Executar cd android ; ./gradlew clean ; cd .. ; react-native run-android funciona para mim, como @mbret apontou (obrigado!)

Ótimo, mas e os aplicativos em produção com clientes reais? : |

Desculpe @ahanusek , não estou dizendo que isso resolve o problema, estou apenas dizendo que no desenvolvimento funcionou para mim (na esperança de que também ajude outra pessoa).

Mas mesmo para desenvolvimento não é uma solução. Ok, você limpa sua compilação, inicia o aplicativo novamente, mas se você usar entradas "dificilmente", ainda poderá obter este erro novamente.

@ahanusek Sim, concordo com você e de forma alguma estou discutindo com você. Esta não é uma solução, mas para mim, e por agora, tem funcionado para me permitir continuar a desenvolver

Também vendo isso, v0.55.4:

Quase certo que não tenho um TextField em uma FlatList ou VirtualizedList, fwiw. Isso está acontecendo em nossa construção de produção.

Vendo este problema em v0.55.4 . E sim, estamos usando TextInput em uma lista.

Acontece em reagir 0,55. Segue

Também acontece no react nativo 0,55, usando a entrada na lista plana.

Fazer uma postagem real aqui, caso as pessoas não vejam meu comentário editado:

Posso dizer que não parece importar em que tipo de ScrollView você colocou seu texto - consegui reproduzir em VirtualizedList e ScrollView, e muitos neste tópico fizeram isso com uma FlatList.
Ou, para dizer de outra forma, o problema se resume a
RN Crashes when loading a very large number of TextInputs. Usually this happens in a ScrollView (or some descended component class of one), but one person got it to happen in a plain View

O mesmo problema

Eu também estou enfrentando o mesmo problema.

Estranhamente, isso não começou a acontecer comigo até a noite passada e estou renderizando TextInputs da mesma maneira há mais de um mês em desenvolvimento.

Android versão 9
Reaja "16.3.1"
React-Native "~ 0,55,2"

Também enfrentamos um problema semelhante em nosso código

Registros de falhas:
Exceção fatal: java.lang.NullPointerException: tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
em android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
em android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
em android.view.View.computeOpaqueFlags (View.java:16791)
em android.view.View.setBackgroundDrawable (View.java:21710)
em android.view.View.setBackground (View.java:21603)
em android.view.View.(View.java:5547)
em android.widget.TextView.(TextView.java:1135)
em android.widget.EditText.(EditText.java:107)
em android.widget.EditText.(EditText.java:103)
em android.widget.EditText.(EditText.java:99)
em android.widget.EditText.(EditText.java:95)
em com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:92)

Qual parece ser o problema aqui?
Tentei algumas investigações:
- mais de 1000 textos de edição funcionam em um aplicativo Android puro
- cerca de 200 ReactTextInput falham conforme identificado aqui

• Algumas análises do problema revelaram um curioso cenário de multithreading saindo do SparseArray
  - SparseArray não é threadsafe e ao mesmo tempo há lógica de gc () dentro dele
  - SparseArray é usado para DrawableContainerState e novo DrawableContainerState pode ser criado usando futuros drawable de um estado constante existente (isto é SparseArray) por clonagem
  - O acima é uma receita para uma exceção de ponteiro nulo multi-threaded e acontece como abaixo
  - Thread de módulo nativo trabalhando na criação do nó de sombra React Edit Text e seu ciclo de vida faz um novo EditText (reactthemedcontext) que, por sua vez, resulta em um drawable de plano de fundo a ser definido e finalmente invocando o código inseguro do thread SparseArray
  - O thread da IU, entretanto, pode ser usado para criar o EditText de exibição de algum outro RTI ao mesmo tempo que leva ao mesmo código inseguro do thread do SparseArray
  - A exceção de nullpointer ocorre quando o gc () é invocado e simultaneamente o clone (esse clone ocorre internamente na classe Drawable *) está sendo feito para o mesmo objeto dando origem a um objeto parcialmente gc-ed. Algo como um item da matriz de valores foi removido e anulado, mas o sinalizador noOfItems ainda não foi atualizado, então o objeto clonado tem um item a menos que o especificado no sinalizador noOfItems e a iteração pode causar exceção de ponteiro nulo para o índice excluído.

Como resolvemos ou fizemos funcionar?
[1] Mova a nova chamada EditText (contexto) no thread de IU e mede o ShadowNode assíncrono, mas esperando até que esse objeto EditText tenha sido criado no thread de IU - basicamente reescreveu o nó de sombra setThemedContext e funções de medição
Deficiências: troca de thread para cada RTI

[2] Crie EditText usando layout inflater no módulo Native enquanto especifica null para o fundo e crie apenas uma vez o drawable de fundo criando um EditText no thread de IU e armazenando em cache seu drawable de fundo no nível de shadowNode. Este drawable é usado para definir o plano de fundo dos dummyEditTexts criados usando o layout inflater para fazer com que a medida considere os preenchimentos de limite do drawable. Neste caso, a medida só precisa esperar uma vez para a criação do Drawable

Eu testei os dois e eles funcionam bem para 1024 ReactTextInput.

Nota: Com base na investigação, esta não parece ser a solução mais elegante, mas funciona com mudanças mínimas e comprova a análise do problema.

Sugestões e críticas são bem-vindas!

Código Shadow Node:

`pacote.richtextinput;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Build;
import android.text.Layout;
import android.view.LayoutInflater;
import android.view.ViewGroup;
import android.widget.EditText;
import com.facebook.infer.annotation.Assertions;
import com.facebook.react.bridge.JSApplicationIllegalArgumentException;
import com.facebook.react.common.annotations.VisibleForTesting;
import com.facebook.react.uimanager.Spacing;
import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.react.uimanager.UIViewOperationQueue;
import com.facebook.react.uimanager.annotations.ReactProp;
import com.facebook.react.views.text.ReactBaseTextShadowNode;
import com.facebook.react.views.text.ReactTextUpdate;
import com.facebook.react.views.textinput.ReactTextInputLocalData;
import com.facebook.react.views.view.MeasureUtil;
import com.facebook.yoga.YogaMeasureFunction;
import com.facebook.yoga.YogaMeasureMode;
import com.facebook.yoga.YogaMeasureOutput;
import com.facebook.yoga.YogaNode;
importar.R;

import javax.annotation.Nullable;
// NOTA: Esta classe não é muito diferente do ReactTextInputShadowNode esperado no mecanismo de
// definindo o contexto do tema e realizando a medida
public class ReactTextInputShadowNode estende ReactBaseTextShadowNode implementa YogaMeasureFunction
{
@VisibleForTesting
public static final String PROP_TEXT = "texto";
private static Drawable sDummyEditTextBackgroundDrawable = null;

private int mMostRecentEventCount = UNSET;
private <strong i="13">@Nullable</strong> EditText mDummyEditText;
private <strong i="14">@Nullable</strong> ReactTextInputLocalData mLocalData;
// Represents the {<strong i="15">@code</strong> text} property only, not possible nested content.
private <strong i="16">@Nullable</strong> String mText = null;

public ReactRichTextInputShadowNode()
{
    mTextBreakStrategy = (Build.VERSION.SDK_INT < Build.VERSION_CODES.M) ?
            0 : Layout.BREAK_STRATEGY_SIMPLE;
    setMeasureFunction(this);
}

<strong i="17">@Override</strong>
public void setThemedContext(final ThemedReactContext themedContext)
{
    super.setThemedContext(themedContext);

    // Inflating with layout using background as null because new EditText(context) call
    // can cause NullPointer Exception during a race scenario of UI thread performing EditText
    // creation with background at the same time
    //   BACKGROUND:
    // ---------------
    // SparseArray is not threadsafe and at the same time there is logic of gc() inside it
    // SparseArray is used by DrawableContainerState and new DrawableContainerState may get
    // created using the an existing constant state's drawable futures(this is SparseArray) by
    // cloning
    // The above is a recipe for a multi-threaded null pointer exception and it happens as below
    //    - Native module thread working on RTI shadow node creation and its lifecycle does a
    //      new EditText(reactThemedContext) which in turn results in background drawable to be
    //      set and finally invoking the SparseArray thread unsafe code
    //    - UI thread meanwhile could be used to create the display EditText of some other RTI
    //      at the same time leading up to the same SparseArray thread unsafe code
    //    - Null pointer exception happens when the gc() is invoked and simultaneously clone is
    //      being done for the same object giving rise to a partially gc-ed object. Something
    //      like an item from values array was removed and null-ed but the noOfItems flag is yet
    //      to be updated, so cloned object has one item less than specified in noOfItems flag
    //      and iteration can cause null pointer exception for the deleted index.
    //
    //   Solution:
    // ------------
    // Create EditText using layout inflater on Native module while specifying null for
    // background and create only once the background drawable by creating an EditText on UI
    // thread and caching its background drawable at shadowNode level. In this case measure only
    // needs to wait once for the Drawable creation
    //      Shortcomings: Ideally we would like to create the Drawable on the same Native module
    //                    thread but not able to access android.internal stylable ids to
    //                    approach this solution

    LayoutInflater sInflater =
            (LayoutInflater) themedContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    EditText editText  =
            (EditText) sInflater.inflate(R.layout.dummy_edit_text, null, false);

    // creating the EditText theme background on UI thread async to prevent above mentioned race
    // scenario
    if (sDummyEditTextBackgroundDrawable == null) {
        themedContext.runOnUiQueueThread(new Runnable() {
            <strong i="18">@Override</strong>
            public void run() {
                sDummyEditTextBackgroundDrawable = new EditText(themedContext).getBackground();
            }
        });
    }

    mDummyEditText = editText;
}

<strong i="19">@Override</strong>
public long measure(YogaNode node, float width, YogaMeasureMode widthMode, float height,
        YogaMeasureMode heightMode)
{
    // measure() should never be called before setThemedContext()
    EditText editText = Assertions.assertNotNull(mDummyEditText);

    if (mLocalData == null || sDummyEditTextBackgroundDrawable == null)
    {
        // No local data or edit text background drawable, no intrinsic size.
        return YogaMeasureOutput.make(0, 0);
    }

    // {<strong i="20">@code</strong> EditText} has by default a border at the bottom of its view
    // called "underline". To have a native look and feel of the TextEdit
    // we have to preserve it at least by default.
    // The border (underline) has its padding set by the background image
    // provided by the system (which vary a lot among versions and vendors
    // of Android), and it cannot be changed.
    // So, we have to enforce it as a default padding.
    // Sharing the same background drawable is not working in measure and Edit Text features.
    // Hence, cloning.
    editText.setBackground(sDummyEditTextBackgroundDrawable.getConstantState().newDrawable());
    setDefaultPadding(Spacing.START, editText.getPaddingStart());
    setDefaultPadding(Spacing.TOP, editText.getPaddingTop());
    setDefaultPadding(Spacing.END, editText.getPaddingEnd());
    setDefaultPadding(Spacing.BOTTOM, editText.getPaddingBottom());

    // We must measure the EditText without paddings, so we have to reset them.
    editText.setPadding(0, 0, 0, 0);

    // This is needed to fix an android bug since 4.4.3 which will throw an NPE in measure,
    // setting the layoutParams fixes it: https://code.google.com/p/android/issues/detail?id=75877
    editText.setLayoutParams(
          new ViewGroup.LayoutParams(
                  ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT));

    mLocalData.apply(editText);
    editText.measure(
          MeasureUtil.getMeasureSpec(width, widthMode),
          MeasureUtil.getMeasureSpec(height, heightMode));
    return YogaMeasureOutput.make(editText.getMeasuredWidth(), editText.getMeasuredHeight());
}

<strong i="21">@Override</strong>
public boolean isVirtualAnchor()
{
    return true;
}

<strong i="22">@Override</strong>
public boolean isYogaLeafNode()
{
    return true;
}

<strong i="23">@Override</strong>
public void setLocalData(Object data)
{
    Assertions.assertCondition(data instanceof ReactTextInputLocalData);
    mLocalData = (ReactTextInputLocalData) data;
    // Telling to Yoga that the node should be remeasured on next layout pass.
    dirty();
    // Note: We should NOT mark the node updated (by calling {<strong i="24">@code</strong> markUpdated}) here
    // because the state remains the same.
}
@ReactProp(name = "mostRecentEventCount")
public void setMostRecentEventCount(int mostRecentEventCount)
{
    mMostRecentEventCount = mostRecentEventCount;
}

@ReactProp(name = PROP_TEXT)
public void setText(<strong i="25">@Nullable</strong> String text)
{
    mText = text;
    markUpdated();
}

public <strong i="26">@Nullable</strong> String getText()
{
    return mText;
}

<strong i="27">@Override</strong>
public void setTextBreakStrategy(<strong i="28">@Nullable</strong> String textBreakStrategy)
{
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.M)
    {
        return;
    }
    if (textBreakStrategy == null || "simple".equals(textBreakStrategy))
    {
        mTextBreakStrategy = Layout.BREAK_STRATEGY_SIMPLE;
    }
    else if ("highQuality".equals(textBreakStrategy))
    {
        mTextBreakStrategy = Layout.BREAK_STRATEGY_HIGH_QUALITY;
    }
    else if ("balanced".equals(textBreakStrategy))
    {
        mTextBreakStrategy = Layout.BREAK_STRATEGY_BALANCED;
    }
    else
    {
        throw new JSApplicationIllegalArgumentException("Invalid textBreakStrategy: " +
                textBreakStrategy);
    }
}

<strong i="29">@Override</strong>
public void onCollectExtraUpdates(UIViewOperationQueue uiViewOperationQueue)
{
    if (mMostRecentEventCount != UNSET)
    {
        ReactTextUpdate reactTextUpdate =
            new ReactTextUpdate(
                    spannedFromShadowNode(this, getText()),
                    mMostRecentEventCount,
                    mContainsImages,
                    getPadding(Spacing.LEFT),
                    getPadding(Spacing.TOP),
                    getPadding(Spacing.RIGHT),
                    getPadding(Spacing.BOTTOM),
                    mTextAlign,
                    mTextBreakStrategy);
        uiViewOperationQueue.enqueueUpdateExtraData(getReactTag(), reactTextUpdate);
    }
}

<strong i="30">@Override</strong>
public void setPadding(int spacingType, float padding)
{
    super.setPadding(spacingType, padding);
    markUpdated();
}

} `

Arquivo de layout de texto fictício

<?xml version="1.0" encoding="utf-8"?> <EditText xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/dummy_edit_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@null" />

@sayantanbugs você tem algum código para esta solução? Obrigado!

Atualizado meu último comentário para incluir o código ShadowNode e o layout usado para aumentar o texto de edição fictício

@sayantanbugs - Excelente trabalho 🕵️! Vamos tentar em nosso projeto e relatar! Obrigado!

O mesmo problema
ReactNative: 0.55.4
Android: 8.0

@sayantanbugs, você pode fornecer um diff / patch?

O mesmo problema. Reportado via Crashlytics sem muitos outros detalhes, então realmente difícil de solucionar.

RN 55,3
Android 8

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
       at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
       at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
       at android.view.View.computeOpaqueFlags(View.java:16791)
       at android.view.View.setBackgroundDrawable(View.java:21710)
       at android.view.View.setBackground(View.java:21603)
       at android.view.View.<init>(View.java:5547)
       at android.widget.TextView.<init>(TextView.java:1135)
       at android.widget.EditText.<init>(EditText.java:107)
       at android.widget.EditText.<init>(EditText.java:103)
       at android.widget.EditText.<init>(EditText.java:99)
       at android.widget.EditText.<init>(EditText.java:95)
       at com.facebook.react.views.textinput.ReactTextInputShadowNode.setThemedContext(ReactTextInputShadowNode.java:80)
       at com.facebook.react.uimanager.UIImplementation.createView(UIImplementation.java:282)
       at com.facebook.react.uimanager.UIManagerModule.createView(UIManagerModule.java:366)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:372)
       at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:160)
       at com.facebook.react.bridge.queue.NativeRunnable.run(NativeRunnable.java)
       at android.os.Handler.handleCallback(Handler.java:789)
       at android.os.Handler.dispatchMessage(Handler.java:98)
       at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:29)
       at android.os.Looper.loop(Looper.java:164)
       at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:192)
       at java.lang.Thread.run(Thread.java:764)

Esta é a principal causa de nosso aplicativo travar na produção. Quando / como isso pode acontecer?

O mesmo aqui na construção de produção.
Acontece ao editar texto. É aleatório.

reagir: 16.3.0
reagente nativo: 0.54.4
mesmo problema, como consertar?

^^^ Mais pessoas devem tentar resolver o problema com a solução @sayantanbugs . Basta localizar seu arquivo ReactTextInputShadowNode.java em sua pasta react-native e trocar o código que ele forneceu na postagem dele. Você pode ficar agradavelmente surpreso.

Depois de uma semana desde que fiz isso, tenho o prazer de informar que o erro só aconteceu novamente. MAS desta vez foi diferente .. Consegui reiniciar o aplicativo e fazê-lo funcionar normalmente sem a necessidade de reinstalá-lo por meio de react-native run-android que foi realmente uma dor porque antes eu literalmente perderia o acesso a algumas telas que renderizou esses TextInputs. Continuarei anotando o erro se ele aparecer novamente, mas até agora acho que funciona quase perfeitamente do meu lado. Excelente depuração, @sayantanbugs!

@ Friendly-Robot imo não é uma solução. É uma solução alternativa na melhor das hipóteses. Isso está acontecendo no código de produção, onde não podemos simplesmente corrigir uma solução não testada que você admite que não corrige.

Se for irritante no dev, claro, por todos os meios. Mas não acho sensato motivar as pessoas a usar isso como uma solução. Talvez como base para um PR.

Concordado com @ Friendly-Robot (no entanto, obrigado @sayantanbugs ). Alguém do RN está aqui? Você acha que o patch pode chegar ao repositório RN e ser testado?

Ok, finalmente consegui testar a abordagem de @sayantanbugs , mas não pareceu funcionar para mim (também é baseado em código não mestre). No entanto, como uma solução temporária (versus uma solução de estrutura), você pode fornecer sua própria cópia de ReactEditText com um método drawableStateChanged() corrigido:

  <strong i="9">@Override</strong>
  protected void drawableStateChanged() {
    try {
      super.drawableStateChanged();
    } catch (Exception e) {
      Timber.e("Prevented Drawable crash!");
    }
  }

Isso é literalmente apenas um patch, mas pelo menos o aplicativo não travará. A entrada de texto ainda é responsiva e funciona conforme o esperado, pelo que eu pude perceber.

Ao reproduzir a falha (agora corrigida), pude ver que essa exceção real aconteceu algumas vezes em rápida sucessão.

EDITAR:
Hmmm ... embora tudo pareça funcionar, parece que o estado Drawable foi corrompido permanentemente. Mesmo depois de criar uma visualização completamente nova com novas entradas de texto, tocar em qualquer entrada de texto fará com que a mensagem seja exibida novamente. Felizmente, ele só aparece ao clicar na entrada e não ao inserir o texto.

Eu estive brincando com minha visão e transição esta noite, recebi esse erro umas vinte vezes ... Eu não estava fazendo nada além de clicar em minhas navegações para testar as transições entre as visões. Eu acho que é um grande negócio: /

Obrigado @ Friendly-Robot por testar a solução!

Concordo com a maioria das opiniões sobre a minha solução ser um patch e mencionei isso no meu post original que inclui a solução. O motivo pelo qual ele ainda pode ser usado em meu projeto é porque criamos um RTI mais rico em recursos do nosso lado, estendendo o RN RTI. Portanto, poderíamos usar minha solução na implementação ShadowNode de meu RTI personalizado. De fato, em nosso projeto, mantemos uma versão modificada do RN para corrigir muitos bugs / casos de uso do RN e, portanto, também podemos incluir essas alterações nele.

Eu planejo dar uma segunda olhada em outras possibilidades, já que tive que resolver o problema candente em questão em questão de alguns dias durante esse tempo.

Obrigado a todos por seus comentários!

@davidmontemayor , se esse problema de estado de drawable estiver sendo notado com minha correção, você poderia modificar o shadowNode para simplesmente fazer new EditText () sempre, mas movendo essa chamada para UIthread e, portanto, não manipulando o drawable de forma alguma. Isso definitivamente resolveria. Eu não queria fazer isso, pois seria uma forma ineficiente de alternar threads quando o objetivo real no nó Shadow era simplesmente obter o preenchimento da borda do plano de fundo, mas o mecanismo empregado pelo RN não está se comportando dessa forma, mas tendo um efeito colateral.
Isso está nos fazendo pensar que podemos estar reescrevendo o ShadowNode nós mesmos, de forma que não precisamos do objeto EditText da maneira como está sendo usado neste ponto, exceto usando a função de medida.

Acontece para mim também. Estou usando ScrollView.
Eu tenho vários controles (rádio, lista, editar texto, etc) em um scrollview. Eu diria que tenho um máximo de 10 controles, então não é uma lista enorme.
Porém, é difícil de reproduzir. Parece acontecer em momentos aleatórios, mas acho que estou rastreando para trazer o aplicativo para o primeiro plano a partir do fundo quando tenho ScrollView na tela (com controles de texto de edição nele).
Não tenho 100% de certeza embora
Estou me perguntando se isso está relacionado à versão lib de suporte do Android.

Vamos FB, conserte esse bug.
É difícil criar aplicativos de qualidade de produção quando temos travamentos aleatórios como este.

com.facebook.react.views.textinput.ReactEditText
RN 0,54
Android SDK 27
Telefone 8.1

Tendo esse problema também, usando ScrollViews. @davidmontemayor , você poderia direcionar seu newb RN para qual arquivo você editou pela estrutura de diretório? Tenho um aplicativo no mercado que o travamento está afetando irritantemente e esperava detectar o erro como você fez até que uma correção aconteça. Você tem um exemplo do arquivo que você usou?

Mesmo:

NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference

@Squidski - Infelizmente, a correção de "pegar todos" fica extremamente complicada quando você começa a lidar com as EditText falhas de inicialização. Em segundo plano, existem _duas_ maneiras diferentes de manifestar este problema:

• Quando o ReactEditText é instanciado ( android.widget.EditText.<init>(EditText.java:95) )
• Quando o ReactEditText é interagido com ( android.widget.TextView.onTouchEvent(TextView.java:8467) )

O principal é substituir a visão criada em ReactTextInputShadowNode . Em vez de deixá-lo fazer new EditText(getThemedContext()) , crie sua própria classe que se estende de EditText . Você pode então capturar a exceção causada pelo segundo caminho em drawableStateChanged() .

A parte mais difícil é consertar os erros de inicialização. Para isso, você precisa criar uma classe "Drawable Wrapper" que pode ser usada para embrulhar qualquer drawable que seja passado para EditText.setBackground() . Este wrapper deve então capturar as exceções lançadas do delegado.

Esse problema ainda acontece aleatoriamente com meu aplicativo com a versão mais recente do React Native + o JSC mais recente + o gradle mais recente em 25 de julho de 2018

React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.3
      CPU: x64 Intel(R) Core(TM) i5-5250U CPU @ 1.60GHz
      Memory: 26.19 MB / 8.00 GB
      Shell: 5.3 - /bin/zsh
    SDKs:
      iOS SDK:
        Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
    IDEs:
      Android Studio: 3.1 AI-173.4720617
      Xcode: 9.4.1/9F2000 - /usr/bin/xcodebuild
    npmPackages:
      react: ^16.4.1 => 16.4.1
      react-native: ^0.56.0 => 0.56.0
    npmGlobalPackages:
      react-native-cli: 2.0.1

JSC: org.webkit:android-jsc:r224109
Gradle: 4.8.1

Comecei a ver esse problema com o Android 8.0.0 e com RN 0.55.3. Há alguma solução alternativa para isso ou talvez um RP?

Tendo o mesmo problema aleatoriamente também com uma FlatList de TextInputs 😞

• React-Native: 0.55.4

java.lang.NullPointerExceptionMainActivity

java.lang.NullPointerException Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference 
    DrawableContainer.java:875 android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures
    DrawableContainer.java:1158 android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity
    DrawableContainer.java:433 android.graphics.drawable.DrawableContainer.getOpacity
    InsetDrawable.java:258 android.graphics.drawable.InsetDrawable.getOpacity
    View.java:15842 android.view.View.computeOpaqueFlags
    View.java:20658 android.view.View.setBackgroundDrawable
    View.java:20551 android.view.View.setBackground
    View.java:5290 android.view.View.<init>
    TextView.java:832 android.widget.TextView.<init>
    EditText.java:88 android.widget.EditText.<init>
    EditText.java:84 android.widget.EditText.<init>
    EditText.java:80 android.widget.EditText.<init>
    EditText.java:76 android.widget.EditText.<init>
    ReactTextInputShadowNode.java:80 com.facebook.react.views.textinput.ReactTextInputShadowNode.setThemedContext
    UIImplementation.java:282 com.facebook.react.uimanager.UIImplementation.createView
    UIManagerModule.java:366 com.facebook.react.uimanager.UIManagerModule.createView
    Method.java:-2 java.lang.reflect.Method.invoke
    JavaMethodWrapper.java:372 com.facebook.react.bridge.JavaMethodWrapper.invoke
    JavaModuleWrapper.java:160 com.facebook.react.bridge.JavaModuleWrapper.invoke
    NativeRunnable.java:-2 com.facebook.react.bridge.queue.NativeRunnable.run
    Handler.java:790 android.os.Handler.handleCallback
    Handler.java:99 android.os.Handler.dispatchMessage
    MessageQueueThreadHandler.java:29 com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage
    Looper.java:164 android.os.Looper.loop
    MessageQueueThreadImpl.java:192 com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run
    Thread.java:764 java.lang.Thread.run

Com base na leitura e depuração, decidi tentar o seguinte neste fim de semana ...

1. Remova todas as chamadas underlineColorAndroid do meu código (estou usando react-native-elements 0.19)

   • o aplicativo deve voltar a usar transparente para controles EditText
   • também tente forçar para transparente

2. Atualize meus estilos de Android para seguir. Isso forçará todos os controles EditText a terem um fundo transparente

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:editTextStyle">@style/AppEditTextStyle</item>
        <item name="editTextStyle">@style/AppEditTextStyle</item> <!-- For compatibility with the support library -->

    </style>

    <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
        <item name="android:background"><strong i="15">@android</strong>:color/transparent</item>
    </style>

</resources>

1. Teste - Teste - Teste. O problema é difícil de reproduzir. Embora um cliente o tenha encontrado esta manhã.

2. Como alternativa, implemente a correção de @sayantanbugs
   4.1 Atualizar react-native-elements para 1.0xx beta

Leituras
https://issuetracker.google.com/issues/37068452
https://github.com/facebook/react-native/issues/18214

RN 0,54
Elementos nativos do React 0,19

Acontece no RN 0.56.0 Android 8.1.0
Querendo saber se há planos para avançar.

Tente substituir todas as instâncias de
underlineColorAndroid={"transparent"}
com
underlineColorAndroid={"#00000000"}

Tendo esse problema. Resolva com algo complicado. Faça um botão que controle a renderização da entrada atual. Portanto, temos FlatList de botões e apenas TextInput que editamos agora. Sem ref, precisamos clicar duas vezes para iniciar a entrada de edição

handleShowInput(key) {
    const { inputKeyToShow } = this.state;

    if (!inputKeyToShow) {
        this.setState({
            inputKeyToShow: key,
        }, () => this.textInput.focus());
    } else {
        this.setState({
            inputKeyToShow: null,
        });
    }
}

{inputKeyToShow !== key ?
    (
        <TouchableOpacity
            ...
            onPress={() => this.handleShowInput(key)}
        >
            <Text>{value}</Text>
        </TouchableOpacity>
    ) :
    (
        <TextInput
            ...
            ref={ref => (this.textInput = ref)}
            value={value}
            onEndEditing={() => this.handleShowInput(key)}
        />
    )
}

@WilliamAlexander @paulroy Será que o seu trabalho solução?

@xstreamcl a solução que postei está funcionando até agora. Mais de 2 semanas e não vi o problema.
Porém, precisa de mais testes;)

Esse problema também estava fazendo com que nosso aplicativo travasse na produção. É um bug desagradável, porque é realmente difícil de reproduzir. Encontramos uma solução promissora para nosso aplicativo e gostaria de compartilhar nossas descobertas aqui para poupar algum tempo e frustração aos outros.

Especificações e versões

Esse bug fez com que nosso aplicativo travasse em dispositivos Samsung, Google e LG Android. Recebemos relatórios de falhas das seguintes versões do Android:

• 8.0.0
• 8.1.0
• 7.1.1

Nosso aplicativo está executando:

• react-native : 0,53,0
• react : 16.2.0

O que causa o acidente

Como outros notaram neste tópico, o problema parece ser desencadeado pela renderização de alguma combinação dos componentes TextInput , FlatList e ScrollView . Em nosso caso, temos uma tela contendo um único TextInput renderizado acima de FlatList . Quando um dos itens em FlatList é tocado, o aplicativo navega para uma nova tela contendo um formulário. O componente raiz deste formulário é um ScrollView que contém uma série de TextInput componentes (junto com alguns botões e outros componentes personalizados). Nosso aplicativo trava quando o usuário toca em um desses FlatList itens (observe que isso não acontece _ toda_ vez).

Reproduzir esse problema é difícil. Na verdade, não foi possível fazer isso. Mas sabemos que a falha ocorre neste ponto do fluxo de trabalho, observando nossas gravações de sessão do Appsee.

Como não podemos reproduzir o problema, tivemos que contar com os registros de travamento do Appsee para depurá-lo. Copiei o rastreamento de pilha dos relatórios de falha abaixo (e omiti algumas seções ruidosas). É mais ou menos idêntico aos rastreamentos de pilha postados neste tópico por outros:

0   java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
1   at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
2   at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
3   at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
4   at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
5   at android.view.View.computeOpaqueFlags(View.java:16900)
6   at android.view.View.setBackgroundDrawable(View.java:21824)
7   at android.view.View.setBackground(View.java:21717)
8   at android.view.View.<init>(View.java:5577)
9   at android.widget.TextView.<init>(TextView.java:1144)
...
13  at android.widget.EditText.<init>(EditText.java:96)
14  at com.facebook.react.views.textinput.ReactEditText.<init>(ReactEditText.java:91)
15  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:91)
16  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:61)
...
35  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1408)

Fonte do problema

Depois de ler este tópico e fazer algumas horas de pesquisa, encontrei o manipulador underlineColorAndroid prop no arquivo ReactTextInputManager.java :

@ReactProp(name = "underlineColorAndroid", customType = "Color")
public void setUnderlineColor(ReactEditText view, <strong i="10">@Nullable</strong> Integer underlineColor) {
  // Drawable.mutate() can sometimes crash due to an AOSP bug:
  // See https://code.google.com/p/android/issues/detail?id=191754 for more info
  Drawable background = view.getBackground();
  Drawable drawableToMutate = background.getConstantState() != null ?
    background.mutate() :
    background;

  if (underlineColor == null) {
    drawableToMutate.clearColorFilter();
  } else {
    drawableToMutate.setColorFilter(underlineColor, PorterDuff.Mode.SRC_IN);
  }
}

O relatório de bug vinculado ao comentário contém o seguinte rastreamento de pilha:

java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable()' on a null object reference
    at android.graphics.drawable.LayerDrawable$ChildDrawable.<init>(LayerDrawable.java:1723)
    at android.graphics.drawable.LayerDrawable$LayerState.<init>(LayerDrawable.java:1792)
    at android.graphics.drawable.LayerDrawable.createConstantState(LayerDrawable.java:152)
    at android.graphics.drawable.LayerDrawable.mutate(LayerDrawable.java:1652)

Isso corresponde ao rastreamento de pilha que encontramos em nosso aplicativo. Não pretendo entender totalmente o problema subjacente, mas parece provável que a causa de nosso aplicativo travar na produção seja devido ao bug Drawable.mutate() sendo acionado. Isso acontece quando tentamos definir o underlineColorAndroid prop em nosso componente TextInput (e assim invocar o método ReactTextInputManager.setUnderlineColor ).

Nosso aplicativo estava renderizando TextInput com os seguintes adereços, um dos quais era underlineColorAndroid="transparent" :

<TextInput
  ref={this.handleRef}
  value={this.props.value}
  autoCorrect={false}
  autoCapitalize="none"
  underlineColorAndroid="transparent"
  onSubmitEditing={this.handleSubmit}
  onChangeText={this.props.onChangeText}
  onFocus={this.handleFocused}
  onBlur={this.handleBlur}
  clearButtonMode="always"
/>

Como consertamos

Precisamos definir este prop para remover o sublinhado dos componentes TextInput em nosso aplicativo. Mas, com base em nossas descobertas, seu manipulador de prop parecia estar acionando um bug do Android que fazia o aplicativo travar ocasionalmente.

Felizmente, existe outra maneira de remover sublinhados de TextInput componentes no Android. Você pode adicionar uma linha ao arquivo android/app/src/main/res/values/styles.xml :

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="16">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
+       <item name="android:editTextBackground"><strong i="17">@android</strong>:color/transparent</item>
    </style>
</resources>

Observe que também vi o seguinte sugerido, mas isso não removeu os sublinhados para nós:

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="22">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
    </style>

+   <!-- This did *not* work for us... -->
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="23">@android</strong>:color/transparent</item>
+   </style>
</resources>

Isso não resolve o problema subjacente. É apenas uma solução alternativa que envolve evitar o uso do underlineColorAndroid prop em TextInput componentes.

Ainda não posso dizer com certeza se isso realmente funciona, porque não consegui reproduzir o problema localmente. Estaremos implantando essa mudança em uma atualização em nosso aplicativo nas próximas semanas. Depois disso, teremos que esperar um pouco para ver se isso ocorre mais. Vou tentar relatar nossas descobertas.

Boa sorte a todos que estão lutando com esse problema frustrante! Eu espero que isso ajude.

Obrigado @Hopding, aparentemente sua solução está funcionando!

@Hopding
Sim trabalhando, muito obrigado

Para nós, esse problema e todos os problemas semelhantes em que você descobre um método de chamada em uma referência nula no Android são causados ​​por não ter o estilo adequado no aplicativo .

O fato é que a maioria dos react-native componentes - se não todos - se estende de appcompat componentes; ie . Portanto, ter um estilo como este é obrigatório:

At somewhere like: /android/app/src/main/res/values/styles.xml

<resources>
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    </style>
</resources>

Isso acontece porque o componente appcopmat não é renderizado em primeiro lugar e, portanto, view.getDrawable() retorna um valor nulo a partir do qual você não pode chamar qualquer método como: setUnderlineColor ou setColorTint (Switches também têm este problema).

Em nosso caso, como estávamos usando react-native para criar bibliotecas nativas que mais tarde serão instaladas em aplicativos nativos, não podemos controlar se os estilos estão presentes no aplicativo final. Tho, pelo menos agora estamos cientes desse problema e melhoramos nossa documentação;)

Espero que ajude!

@sospedra Seu comentário faz sentido, mas verifiquei meu código e descobri que appcompat já existe no meu estilo. Se você verificar a solução alternativa de Hopding, ele também já tem appcompat .

@Hopding
Este estilo funciona bem:

@WilliamAlexander , não consegui fazer sua sugestão funcionar. Você pode incluir todo o estilo que funciona para você?
O outro problema que estou enfrentando é que, ao aplicar a correção de @Hopding , ela afetou o layout da minha entrada de texto multilinha, de forma que o teclado agora cobre parcialmente a entrada de texto. Arrancando meu cabelo tentando consertar esse problema aparentemente simples

Atualização: o estilo de @Hopding precisa ser escrito desta forma

    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:editTextStyle">@style/AppEditTextStyle</item>
    </style>

    <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
     <item name="android:background"><strong i="11">@android</strong>:color/transparent</item>
     <item name="android:paddingTop">??dp</item>
     <item name="android:paddingBottom">??dp</item>
    </style>

Tive que adicionar o preenchimento para corrigir a quebra de layout.

@ gavin-gmlab.

Aqui está.
`

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <!-- Main theme colors -->
    <!--   your app branding color for the app bar -->
    <item name="android:colorPrimary">@color/colorPrimary</item>
    <!--   darker variant for the status bar and contextual app bars -->
    <item name="android:colorPrimaryDark">@color/colorPrimaryDark</item>
    <!--   theme UI controls like checkboxes and text fields -->
    <item name="android:colorAccent">@color/colorAccent</item>

    <item name="android:editTextStyle">@style/AppEditTextStyle</item>
    <item name="editTextStyle">@style/AppEditTextStyle</item> <!-- For compatibility with the support library -->

    <item name="android:windowIsTranslucent">true</item>
</style>

 <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
    <item name="android:background"><strong i="9">@android</strong>:color/transparent</item>
</style>

`

Removido underlineColorAndroid = "transparente"

e mudou o style.xml

está funcionando para mim

nenhuma das soluções acima funcionou para mim, mas, aparentemente, fechar o aplicativo mais o empacotador e executar novamente funcionou

Simplesmente limpe os dados do seu aplicativo e execute novamente

Graças @WilliamAlexander e @Hopding para a sua solução, mas quando eu mudar o fundo que ele remove o preenchimento do meu InputText também. Em vez disso, usei backgroundTint e funciona bem sem qualquer alteração no preenchimento

`` ``

<style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
    <item name="backgroundTint"><strong i="12">@android</strong>:color/transparent</item>
</style>

`` ``

Ok, existe alguma solução para isso para os usuários da Expo, exceto ejetar?

@Twishka Infelizmente, você também teria que ejetar para o reagente nativo bruto, porque a Expokit tem os mesmos problemas.

Não estou nem configurando underlineColorAndroid em nenhum lugar do meu aplicativo que ainda tenha esse log no console do Firebase. E não tenho ideia de como reproduzir esse problema novamente.

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
       at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
       at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
       at android.view.View.computeOpaqueFlags(View.java:15945)
       at android.view.View.setBackgroundDrawable(View.java:20887)
       at android.view.View.setBackground(View.java:20780)
       at android.view.View.(View.java:5311)
       at android.widget.TextView.(TextView.java:850)
       at android.widget.EditText.(EditText.java:95)
       at android.widget.EditText.(EditText.java:91)
       at android.widget.EditText.(EditText.java:87)
       at android.widget.EditText.(EditText.java:83)
       at com.facebook.react.views.textinput.ReactEditText.(SourceFile:92)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(SourceFile:100)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(SourceFile:60)
       at com.facebook.react.uimanager.ViewManager.createView(SourceFile:42)
       at com.facebook.react.uimanager.NativeViewHierarchyManager.createView(SourceFile:260)
       at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute(SourceFile:200)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.dispatchPendingNonBatchedOperations(SourceFile:1085)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(SourceFile:1056)
       at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(SourceFile:29)
       at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(SourceFile:134)
       at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(SourceFile:105)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:918)
       at android.view.Choreographer.doCallbacks(Choreographer.java:732)
       at android.view.Choreographer.doFrame(Choreographer.java:661)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:906)
       at android.os.Handler.handleCallback(Handler.java:790)
       at android.os.Handler.dispatchMessage(Handler.java:99)
       at android.os.Looper.loop(Looper.java:187)
       at android.app.ActivityThread.main(ActivityThread.java:7025)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:514)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:888)

Por falar em cores, coloquei placeHolderTextColor e borderColor em #acacac e, quando ocorrer algum problema de validação, borderColor em red . Tirando isso, não estou nem definindo underlineColorAndroid .

Qualquer ajuda é apreciada.

@mddanishansari Como rn 0,56 underlineColorAndroid é definido por padrão , então você precisa da correção mencionada acima.

@mddanishansari Como rn 0,56 underlineColorAndroid é definido por padrão , então você precisa da correção mencionada acima.

Muito obrigado. Eu não esperava uma resposta tão rápida. O problema é que então todo o outro fundo nativo original EditText também é transparente, o que parece estranho. Algumas telas do meu aplicativo também estão em nativo original (Java).

Eu estava me perguntando como esse problema pode ser resolvido na verdade. A solução fornecida é apenas um hack simples. Direito?

Oi pessoal. Portanto, o uso de underlineColorAndroid aciona essa falha de alguma forma.
Mas agora, além disso, underlineColorAndroid é definido por padrão.
Como posso evitar o uso disso e voltar para styles.xml.?

Saudações

Apenas no caso de ajudar alguém. No meu caso, enviei acidentalmente NaN em vez do valor real da cor que aconteceu comigo em 'borderBottomLeftRadius' Não tive problemas com o Iphone apenas Android.

as soluções neste tópico não estão funcionando para mim. Mesmo ao definir underlineColorAndroid para todas as minhas entradas de texto como algo não transparente (testei com '#f00' ), ainda estou tendo esse problema.

Para mim, o problema não ocorre de forma consistente. Eu tenho um monte de TextInputs em um ScrollView e preciso abrir e fechar a tela várias vezes para que ocorra

Não é a transparência que causa o erro, é a mudança do
cor nativa do suporte nativo reagir. É que quase todo mundo
torna o sublinhado nativo transparente com o suporte.

Na quarta-feira, 6 de fevereiro de 2019, 22h23, Adrien Pyke [email protected] escreveu:

as soluções neste tópico não estão funcionando para mim. Mesmo ao definir o
underlineColorAndroid para todas as minhas entradas de texto para algo não transparente
(Eu testei com '# f00'), ainda estou tendo esse problema.

Para mim, o problema não ocorre de forma consistente. Eu tenho um monte de TextInputs
dentro de um ScrollView, e tenho que abrir e fechar a tela várias vezes
para que ocorra

-
Você está recebendo isso porque comentou.
Responda a este e-mail diretamente, visualize-o no GitHub
https://github.com/facebook/react-native/issues/17530#issuecomment-461283498 ,
ou silenciar o tópico
https://github.com/notifications/unsubscribe-auth/AOG_BAlfs-GKED4gOuvtKlMD0vwEH-_zks5vK6ozgaJpZM4RaUHf
.

OK eu vejo.

Só por curiosidade, tentei remover o valor padrão de transparente daqui

https://github.com/facebook/react-native/commit/a3a98eb1c7fa0054a236d45421393874ce8ce558

Curiosamente, o erro ainda ocorre para mim

Acabei de experimentar esse bug no Android RN 58.3. Não havia rima ou razão aparente, exceto que sempre que eu renderizava um componente TextInput , o erro era gerado. Mesmo se eu renderizasse um TextInput sem adereços ou alterações, ele ainda travaria.

Tentei reiniciar o Metro e redefinir o cache, mas não funcionou. Na verdade, tive que abrir o Android Studio e reconstruir o aplicativo, momento em que ele começou a funcionar. Isso pode ser um problema com o gradle não agrupar dependências corretamente ou algo assim? Parece um tiro no escuro, já que eu estava desenvolvendo por boas 4 horas sem reiniciar nada antes de ter esse problema, mas eu realmente não consigo pensar no que mais poderia causar isso.

Eu encontrei este erro no RN 58,0 nos dispositivos:
Redmi Note 6 Pro - Android 8.1
Mi A2 Lite - Android 9
WAS-LX1A - Android 8

Aparece às vezes olhando no Sentinela, espero que ajude.

Os desenvolvedores resolverão esse problema? solução alternativa não é adequada para nós!

eu tenho esse mesmo em produção

Temos o mesmo rastreamento de pilha como dois relatados acima, no React 0,59

(com DrawableContainerState.createAllFutures na 2ª linha do rastreamento de pilha)

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
       at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
       at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
       at android.view.View.computeOpaqueFlags(View.java:15718)
       at android.view.View.setBackgroundDrawable(View.java:20528)
       at android.view.View.setBackground(View.java:20421)
       at android.view.View.<init>(View.java:5248)
       at android.widget.TextView.<init>(TextView.java:826)
       at android.widget.EditText.<init>(EditText.java:88)
       at android.widget.EditText.<init>(EditText.java:84)
       at android.widget.EditText.<init>(EditText.java:80)
       at android.widget.EditText.<init>(EditText.java:76)
       at com.facebook.react.views.textinput.ReactEditText.<init>(ReactEditText.java:89)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:102)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:62)
       at com.facebook.react.uimanager.ViewManager.createView(ViewManager.java:47)
       at com.facebook.react.uimanager.NativeViewHierarchyManager.createView(NativeViewHierarchyManager.java:256)
       at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute(UIViewOperationQueue.java:200)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.dispatchPendingNonBatchedOperations(UIViewOperationQueue.java:1109)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded(UIViewOperationQueue.java:1080)
       at com.facebook.react.uimanager.GuardedFrameCallback.doFrame(GuardedFrameCallback.java:29)
       at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame(ReactChoreographer.java:166)
       at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame(ChoreographerCompat.java:84)
       at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1027)
       at android.view.Choreographer.doCallbacks(Choreographer.java:841)
       at android.view.Choreographer.doFrame(Choreographer.java:769)
       at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1015)
       at android.os.Handler.handleCallback(Handler.java:794)
       at android.os.Handler.dispatchMessage(Handler.java:99)
       at android.os.Looper.loop(Looper.java:176)
       at android.app.ActivityThread.main(ActivityThread.java:6635)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:547)
       at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:823)

Acabei de obter o mesmo rastreamento de pilha acima após atualizar a versão de produção de 0.58.6 para 0.59.1 apenas algumas horas atrás. Receio que seja um problema sério.

Alguma solução para este problema?

@sunnylqm existe uma maneira de definir underlineColorAndroid como nulo, já que é definido por padrão?

@pedrosimao @tamdao
Você tem que remover manualmente esta linha através de alguma ferramenta de patch como configuração xml .
Portanto, o ponto-chave é not set any value to underlineColorAndroid anywhere até que algum herói encontre uma maneira de consertar isso.

Eu peguei esse erro hoje
Funciona bem antes, mas depois de alguma compilação, o erro ocorreu no meu dispositivo
Para mim, a solução alternativa para esse problema é desinstalar o aplicativo no dispositivo e, em seguida, reinstalar o aplicativo por meio do android de execução react-native
Depois disso, o problema desaparece

A propósito, eu não uso adereços underlineColorAndroid, então não funciona independentemente de definir ou remover qualquer valor para esses adereços

Isso acontece aleatoriamente quando você usa algumas entradas de texto em um scrollview. underlineColorAndroid é sempre usado porque é definido por padrão .

Aconteceu comigo hoje também, na Expo.

Se você estiver na Expo, você precisará fechar o servidor expo, seu aplicativo e o aplicativo Expo completamente. E reabri-los novamente.

Caso contrário, o erro não desapareceria.

Aconteceu comigo, na Expo.

Por algum motivo, houve duas instâncias do meu aplicativo em segundo plano. Quando cliquei no botão quadrado do android, chamado "Visão geral", para ver os aplicativos na memória, vi essas duas instâncias do meu aplicativo .. quando fechei e executei o aplicativo novamente, ele não mostrava mais esse erro.

Então, como os caras disseram anteriormente, feche tudo e execute novamente para consertar

Passei 3 horas tentando descobrir esse erro sem resultados, então reinstalei meu aplicativo no emulador de Android e o erro foi embora.

Tente 0.59.4 para ver se você ainda encontra esta falha.

@sunnylqm Ainda encontrando isso em 0.59.5.

Android: 8.0.0
Android Build: R16NW
Manufacturer: samsung
Model: SM-G955F

java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
  at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
  at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
  at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
  at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
  at android.view.View.computeOpaqueFlags(View.java:16791)
  at android.view.View.setBackgroundDrawable(View.java:21710)
  at android.view.View.setBackground(View.java:21603)
  at android.view.View.<init>(View.java:5547)
  at android.widget.TextView.<init>(TextView.java:1135)
  at android.widget.EditText.<init>(EditText.java:107)
  at android.widget.EditText.<init>(EditText.java:103)
  at android.widget.EditText.<init>(EditText.java:99)
  at android.widget.EditText.<init>(EditText.java:95)
  at com.facebook.react.views.textinput.c.<init>
  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance
  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance
  at com.facebook.react.uimanager.ViewManager.createView
  at com.facebook.react.uimanager.k.a
  at com.facebook.react.uimanager.aq$e.a
  at com.facebook.react.uimanager.aq$h.c
  at com.facebook.react.uimanager.aq$h.a
  at com.facebook.react.uimanager.e.b
  at com.facebook.react.modules.core.e$b.b
  at com.facebook.react.modules.core.a$a$1.doFrame
  at android.view.Choreographer$CallbackRecord.run(Choreographer.java:909)
  at android.view.Choreographer.doCallbacks(Choreographer.java:723)
  at android.view.Choreographer.doFrame(Choreographer.java:655)
  at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:897)
  at android.os.Handler.handleCallback(Handler.java:789)
  at android.os.Handler.dispatchMessage(Handler.java:98)
  at android.os.Looper.loop(Looper.java:164)
  at android.app.ActivityThread.main(ActivityThread.java:6938)
  at java.lang.reflect.Method.invoke(Method.java:-2)
  at com.android.internal.os.Zygote$MethodAndArgsCaller.run(Zygote.java:327)
  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1374)

Eu tenho este erro com um componente que processa vários TextInputs,
Quando eu reinicio a compilação ou o aplicativo, ele vai e volta quando eu renderizo pela segunda vez.

Android: 9
Telefone: SAMSUNG Galaxy note 9
Modelo: SM-N960F / DS
versão react-native "0.58.5"

Tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
createAllFutures
DrawableContainer. java: 875
getOpacity
DrawableContainer. java: 1158
getOpacity
DrawableContainer. java: 433
getOpacity
InsetDrawable. java: 258
computeOpaqueFlags
Visão. java: 18165
setBackgroundDrawable
Visão. java: 23335
setBackground
Visão. java: 23228

Visão. java: 5952

TextView. java: 1108

Editar texto. java: 106

Editar texto. java: 102

Editar texto. java: 98

Editar texto. java: 94
setThemedContext
ReactTextInputShadowNode. java: 73
createView
UIImplementation. java: 288
createView
UIManagerModule. java: 449
invocar
Method.java
invocar
JavaMethodWrapper. java: 372
invocar
JavaModuleWrapper. java: 158
corre
NativeRunnable.java
handleCallback
Handler. java: 873
dispatchMessage
Handler. java: 99
dispatchMessage
MessageQueueThreadHandler. java: 29
ciclo
Looper. java: 214
corre
MessageQueueThreadImpl. java: 192
corre
Fio. java: 764

Também estou tendo o mesmo problema no Samsung Note 8, no Android versão 9 e no React nativo 0.57.0

Mesmo problema aqui. React Native 0.59.0. O problema simplesmente aparece aleatoriamente ao usar o aplicativo. Não foi possível ver nenhum padrão para que ele apareça. Acontece no modo de desenvolvimento e na produção.

Esse problema também estava fazendo com que nosso aplicativo travasse na produção. É um bug desagradável, porque é realmente difícil de reproduzir. Encontramos uma solução promissora para nosso aplicativo e gostaria de compartilhar nossas descobertas aqui para poupar algum tempo e frustração aos outros.

Especificações e versões

Esse bug fez com que nosso aplicativo travasse em dispositivos Samsung, Google e LG Android. Recebemos relatórios de falhas das seguintes versões do Android:

• 8.0.0
• 8.1.0
• 7.1.1

Nosso aplicativo está executando:

• react-native : 0,53,0
• react : 16.2.0

O que causa o acidente

Como outros notaram neste tópico, o problema parece ser desencadeado pela renderização de alguma combinação dos componentes TextInput , FlatList e ScrollView . Em nosso caso, temos uma tela contendo um único TextInput renderizado acima de FlatList . Quando um dos itens em FlatList é tocado, o aplicativo navega para uma nova tela contendo um formulário. O componente raiz deste formulário é um ScrollView que contém uma série de TextInput componentes (junto com alguns botões e outros componentes personalizados). Nosso aplicativo trava quando o usuário toca em um desses FlatList itens (observe que isso não acontece _ toda_ vez).

Reproduzir esse problema é difícil. Na verdade, não foi possível fazer isso. Mas sabemos que a falha ocorre neste ponto do fluxo de trabalho, observando nossas gravações de sessão do Appsee.

Como não podemos reproduzir o problema, tivemos que contar com os registros de travamento do Appsee para depurá-lo. Copiei o rastreamento de pilha dos relatórios de falha abaixo (e omiti algumas seções ruidosas). É mais ou menos idêntico aos rastreamentos de pilha postados neste tópico por outros:

0     java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
1     at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
2     at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
3     at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
4     at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
5     at android.view.View.computeOpaqueFlags(View.java:16900)
6     at android.view.View.setBackgroundDrawable(View.java:21824)
7     at android.view.View.setBackground(View.java:21717)
8     at android.view.View.<init>(View.java:5577)
9     at android.widget.TextView.<init>(TextView.java:1144)
...
13    at android.widget.EditText.<init>(EditText.java:96)
14    at com.facebook.react.views.textinput.ReactEditText.<init>(ReactEditText.java:91)
15    at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:91)
16    at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:61)
...
35    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1408)

Fonte do problema

Depois de ler este tópico e fazer algumas horas de pesquisa, encontrei o manipulador underlineColorAndroid prop no arquivo ReactTextInputManager.java :

@ReactProp(name = "underlineColorAndroid", customType = "Color")
public void setUnderlineColor(ReactEditText view, <strong i="42">@Nullable</strong> Integer underlineColor) {
  // Drawable.mutate() can sometimes crash due to an AOSP bug:
  // See https://code.google.com/p/android/issues/detail?id=191754 for more info
  Drawable background = view.getBackground();
  Drawable drawableToMutate = background.getConstantState() != null ?
    background.mutate() :
    background;

  if (underlineColor == null) {
    drawableToMutate.clearColorFilter();
  } else {
    drawableToMutate.setColorFilter(underlineColor, PorterDuff.Mode.SRC_IN);
  }
}

O relatório de bug vinculado ao comentário contém o seguinte rastreamento de pilha:

java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable()' on a null object reference
    at android.graphics.drawable.LayerDrawable$ChildDrawable.<init>(LayerDrawable.java:1723)
    at android.graphics.drawable.LayerDrawable$LayerState.<init>(LayerDrawable.java:1792)
    at android.graphics.drawable.LayerDrawable.createConstantState(LayerDrawable.java:152)
    at android.graphics.drawable.LayerDrawable.mutate(LayerDrawable.java:1652)

Isso corresponde ao rastreamento de pilha que encontramos em nosso aplicativo. Não pretendo entender totalmente o problema subjacente, mas parece provável que a causa de nosso aplicativo travar na produção seja devido ao bug Drawable.mutate() sendo acionado. Isso acontece quando tentamos definir o underlineColorAndroid prop em nosso componente TextInput (e assim invocar o método ReactTextInputManager.setUnderlineColor ).

Nosso aplicativo estava renderizando TextInput com os seguintes adereços, um dos quais era underlineColorAndroid="transparent" :

<TextInput
  ref={this.handleRef}
  value={this.props.value}
  autoCorrect={false}
  autoCapitalize="none"
  underlineColorAndroid="transparent"
  onSubmitEditing={this.handleSubmit}
  onChangeText={this.props.onChangeText}
  onFocus={this.handleFocused}
  onBlur={this.handleBlur}
  clearButtonMode="always"
/>

Como consertamos

Precisamos definir este prop para remover o sublinhado dos componentes TextInput em nosso aplicativo. Mas, com base em nossas descobertas, seu manipulador de prop parecia estar acionando um bug do Android que fazia o aplicativo travar ocasionalmente.

Felizmente, há outra maneira de remover sublinhados de TextInput componentes no Android. Você pode adicionar uma linha ao arquivo android/app/src/main/res/values/styles.xml :

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="65">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
+       <item name="android:editTextBackground"><strong i="66">@android</strong>:color/transparent</item>
    </style>
</resources>

Observe que também vi o seguinte sugerido, mas isso não removeu os sublinhados para nós:

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="71">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
    </style>

+   <!-- This did *not* work for us... -->
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="72">@android</strong>:color/transparent</item>
+   </style>
</resources>

Isso não resolve o problema subjacente. É apenas uma solução alternativa que envolve evitar o uso do underlineColorAndroid prop em componentes TextInput .

Ainda não posso dizer com certeza se isso realmente funciona, porque não consegui reproduzir o problema localmente. Estaremos implantando essa mudança em uma atualização em nosso aplicativo nas próximas semanas. Depois disso, teremos que esperar um pouco para ver se isso ocorre mais. Vou tentar relatar nossas descobertas.

Boa sorte a todos que estão lutando com esse problema frustrante! Eu espero que isso ajude.

Eu sei como reproduzir essa situação. Clique novamente no formulário como você disse e, em seguida, clique no item na lista plana para entrar no formulário. Repita cerca de dez vezes, e um pouco mais rápido, esse erro ocorrerá. Você pode reproduzir o erro de acordo com o que eu disse.

@Hopding
Eu sei como reproduzir essa situação. Clique novamente no formulário como você disse e, em seguida, clique no item na lista plana para entrar no formulário. Repita cerca de dez vezes, e um pouco mais rápido, esse erro ocorrerá. Você pode reproduzir o erro de acordo com o que eu disse.

@Hopding
Eu removi underlineColorAndroid, mas vou reproduzi-lo.

@ react-native-bot este problema é muito importante

Estou usando RN 59.5 e também tenho esse problema ..

Tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
createAllFutures
DrawableContainer. java: 875
getOpacity
DrawableContainer. java: 1158
getOpacity
DrawableContainer. java: 433
getOpacity
InsetDrawable. java: 258
computeOpaqueFlags
Visão. java: 16594
setBackgroundDrawable
Visão. java: 21577
setBackground
Visão. java: 21470

Visão. java: 5498

TextView. java: 875

Editar texto. java: 88

Editar texto. java: 84

Editar texto. java: 80

Editar texto. java: 76
setThemedContext
ReactTextInputShadowNode. java: 76
createView
UIImplementation. java: 294
createView
UIManagerModule. java: 462
invocar
Method.java
invocar
JavaMethodWrapper. java: 372
invocar
JavaModuleWrapper. java: 158
corre
NativeRunnable.java
handleCallback
Handler. java: 873
dispatchMessage
Handler. java: 99
dispatchMessage
MessageQueueThreadHandler. java: 29
ciclo
Looper. java: 193
corre
MessageQueueThreadImpl. java: 232
corre
Fio. java: 764

Alguém já resolveu isso ?? Estou com esse problema no RN 52, atualizei para 56 mas continuo dando erro. Tentei os passos para reproduzi-lo, mas não consigo. Alguns dispositivos ainda disparam aleatoriamente.

alguma sorte com este problema?

eu entendo esse problema RN 0.59.5

Esse problema também estava fazendo com que nosso aplicativo travasse na produção. É um bug desagradável, porque é realmente difícil de reproduzir. Encontramos uma solução promissora para nosso aplicativo e gostaria de compartilhar nossas descobertas aqui para poupar algum tempo e frustração aos outros.

Especificações e versões

Esse bug fez com que nosso aplicativo travasse em dispositivos Samsung, Google e LG Android. Recebemos relatórios de falhas das seguintes versões do Android:

• 8.0.0
• 8.1.0
• 7.1.1

Nosso aplicativo está executando:

• react-native : 0,53,0
• react : 16.2.0

O que causa o acidente

Como outros notaram neste tópico, o problema parece ser desencadeado pela renderização de alguma combinação dos componentes TextInput , FlatList e ScrollView . Em nosso caso, temos uma tela contendo um único TextInput renderizado acima de FlatList . Quando um dos itens em FlatList é tocado, o aplicativo navega para uma nova tela contendo um formulário. O componente raiz deste formulário é um ScrollView que contém uma série de TextInput componentes (junto com alguns botões e outros componentes personalizados). Nosso aplicativo trava quando o usuário toca em um desses FlatList itens (observe que isso não acontece _ toda_ vez).
Reproduzir esse problema é difícil. Na verdade, não foi possível fazer isso. Mas sabemos que a falha ocorre neste ponto do fluxo de trabalho, observando nossas gravações de sessão do Appsee.
Como não podemos reproduzir o problema, tivemos que contar com os registros de travamento do Appsee para depurá-lo. Copiei o rastreamento de pilha dos relatórios de falha abaixo (e omiti algumas seções ruidosas). É mais ou menos idêntico aos rastreamentos de pilha postados neste tópico por outros:

0   java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
1   at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
2   at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
3   at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
4   at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
5   at android.view.View.computeOpaqueFlags(View.java:16900)
6   at android.view.View.setBackgroundDrawable(View.java:21824)
7   at android.view.View.setBackground(View.java:21717)
8   at android.view.View.<init>(View.java:5577)
9   at android.widget.TextView.<init>(TextView.java:1144)
...
13  at android.widget.EditText.<init>(EditText.java:96)
14  at com.facebook.react.views.textinput.ReactEditText.<init>(ReactEditText.java:91)
15  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:91)
16  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:61)
...
35  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1408)

Fonte do problema

Depois de ler este tópico e fazer algumas horas de pesquisa, encontrei o manipulador underlineColorAndroid prop no arquivo ReactTextInputManager.java :

@ReactProp(name = "underlineColorAndroid", customType = "Color")
public void setUnderlineColor(ReactEditText view, <strong i="43">@Nullable</strong> Integer underlineColor) {
  // Drawable.mutate() can sometimes crash due to an AOSP bug:
  // See https://code.google.com/p/android/issues/detail?id=191754 for more info
  Drawable background = view.getBackground();
  Drawable drawableToMutate = background.getConstantState() != null ?
    background.mutate() :
    background;

  if (underlineColor == null) {
    drawableToMutate.clearColorFilter();
  } else {
    drawableToMutate.setColorFilter(underlineColor, PorterDuff.Mode.SRC_IN);
  }
}

O relatório de bug vinculado ao comentário contém o seguinte rastreamento de pilha:

java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable()' on a null object reference
    at android.graphics.drawable.LayerDrawable$ChildDrawable.<init>(LayerDrawable.java:1723)
    at android.graphics.drawable.LayerDrawable$LayerState.<init>(LayerDrawable.java:1792)
    at android.graphics.drawable.LayerDrawable.createConstantState(LayerDrawable.java:152)
    at android.graphics.drawable.LayerDrawable.mutate(LayerDrawable.java:1652)

Isso corresponde ao rastreamento de pilha que encontramos em nosso aplicativo. Não pretendo entender totalmente o problema subjacente, mas parece provável que a causa de nosso aplicativo travar na produção seja devido ao bug Drawable.mutate() sendo acionado. Isso acontece quando tentamos definir o underlineColorAndroid prop em nosso componente TextInput (e assim invocar o método ReactTextInputManager.setUnderlineColor ).
Nosso aplicativo estava renderizando TextInput com os seguintes adereços, um dos quais era underlineColorAndroid="transparent" :

<TextInput
  ref={this.handleRef}
  value={this.props.value}
  autoCorrect={false}
  autoCapitalize="none"
  underlineColorAndroid="transparent"
  onSubmitEditing={this.handleSubmit}
  onChangeText={this.props.onChangeText}
  onFocus={this.handleFocused}
  onBlur={this.handleBlur}
  clearButtonMode="always"
/>

Como consertamos

Precisamos definir este prop para remover o sublinhado dos componentes TextInput em nosso aplicativo. Mas, com base em nossas descobertas, seu manipulador de prop parecia estar acionando um bug do Android que fazia o aplicativo travar ocasionalmente.
Felizmente, há outra maneira de remover sublinhados de TextInput componentes no Android. Você pode adicionar uma linha ao arquivo android/app/src/main/res/values/styles.xml :

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="66">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
+       <item name="android:editTextBackground"><strong i="67">@android</strong>:color/transparent</item>
    </style>
</resources>

Observe que também vi o seguinte sugerido, mas isso não removeu os sublinhados para nós:

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="72">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
    </style>

+   <!-- This did *not* work for us... -->
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="73">@android</strong>:color/transparent</item>
+   </style>
</resources>

Isso não resolve o problema subjacente. É apenas uma solução alternativa que envolve evitar o uso do underlineColorAndroid prop em componentes TextInput .
Ainda não posso dizer com certeza se isso realmente funciona, porque não consegui reproduzir o problema localmente. Estaremos implantando essa mudança em uma atualização em nosso aplicativo nas próximas semanas. Depois disso, teremos que esperar um pouco para ver se isso ocorre mais. Vou tentar relatar nossas descobertas.
Boa sorte a todos que estão lutando com esse problema frustrante! Eu espero que isso ajude.

Eu sei como reproduzir essa situação. Clique novamente no formulário como você disse e, em seguida, clique no item na lista plana para entrar no formulário. Repita cerca de dez vezes, e um pouco mais rápido, esse erro ocorrerá. Você pode reproduzir o erro de acordo com o que eu disse.

Parece que isso resolve tudo.

Para aqueles que estão se perguntando como reproduzir: Nós o reproduzimos adicionando 100 <TextInput ...> s a um <ScrollView ...> . Nesse ponto, fomos capazes de reproduzir o erro com uma taxa de sucesso estimada de 75% -90%. O suficiente para tentar soluções. 50 campos não eram suficientes.

A solução alternativa de @Hopding funcionou para nós. A solução de "tonalidade" alternativa proposta (por outros) não funciona. O infeliz efeito colateral da solução alternativa é que o preenchimento é removido das entradas de texto.

O mesmo aqui.

Exceção fatal: java.lang.NullPointerException: tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
em android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
em android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
em android.view.View.computeOpaqueFlags (View.java:18188)
em android.view.View.setBackgroundDrawable (View.java:23358)
em android.view.View.setBackground (View.java:23251)
em android.view.View.(View.java:5948)
em android.widget.TextView.(TextView.java:1118)
em android.widget.EditText.(EditText.java:106)
em android.widget.EditText.(EditText.java:102)
em android.widget.EditText.(EditText.java:98)
em android.widget.EditText.(EditText.java:94)
em com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:89)
em com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:105)
em com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:65)
em com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:47)
em com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:256)
em com.facebook.react.uimanager.UIViewOperationQueue $ CreateViewOperation.execute (UIViewOperationQueue.java:200)
em com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:1109)
em com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.doFrameGuarded (UIViewOperationQueue.java:1080)
em com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:29)
em com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreographer.java:166)
em com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:84)
em android.view.Choreographer $ CallbackRecord.run (Choreographer.java:947)
em android.view.Choreographer.doCallbacks (Choreographer.java:761)
em android.view.Choreographer.doFrame (Choreographer.java:693)
em android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:935)
em android.os.Handler.handleCallback (Handler.java:873)
em android.os.Handler.dispatchMessage (Handler.java:99)
em android.os.Looper.loop (Looper.java:214)
em android.app.ActivityThread.main (ActivityThread.java:7045)
em java.lang.reflect.Method.invoke (Method.java)
em com.android.internal.os.RuntimeInit $ MethodAndArgsCaller.run (RuntimeInit.java:493)
em com.android.internal.os.ZygoteInit.main (ZygoteInit.java:965)

alguma solução alternativa?

Aqui está um código onde o erro é reproduzido RN 0.59.8

> import React, { Component } from 'react';
> import { StyleSheet, Text, View, TextInput, FlatList, TouchableOpacity } from 'react-native';
> 
> export default class App extends Component {
>   state = { Valor: [] }
>   componentDidMount() {
>     for (i = 0; i < 90000; i++) {
>       var te = { ID: i }
>       this.state.Valor.push(te)
>     }
>   }
> 
>   keyExtractor = (item, index) => item.ID.toString();
>   renderList = () => {
>     return (
>       <FlatList
>         keyExtractor={this.keyExtractor}
>         data={this.state.Valor}
>         renderItem={({ item }) => (
>           <TouchableOpacity
>             activeOpacity={0.5}
>             onPress={() => alert("hola")} >
>             <View style={{ flex: 1 }}>
>               <Text>Muestra</Text>
>               <TextInput
>                 underlineColorAndroid={"transparent"}
>                 placeholder={"Ingrese"}
>                 keyboardType="phone-pad"
>               />
>             </View>
>           </TouchableOpacity>
>         )}
>       >
>       </FlatList>
>     );
>   };
> 
>   render() {
>     return (
>       <View style={styles.container}>
>         {this.renderList()}
>       </View>
>     );
>   }
> }
> 
> const styles = StyleSheet.create({
>   container: {
>     flex: 1,
>     justifyContent: 'flex-start',
>     alignItems: 'flex-start',
>     backgroundColor: '#F5FCFF',
>   },
>   welcome: {
>     fontSize: 20,
>     textAlign: 'center',
>     margin: 10,
>   },
>   instructions: {
>     textAlign: 'center',
>     color: '#333333',
>     marginBottom: 5,
>   }
> });
> 

Vídeo: https://www.youtube.com/watch?v=FJ6YvXrevMQ&feature=youtu.be

Solução plz.

Esta edição foi aberta em 11 de janeiro de 2018 e agora é maio de 2019, por que ninguém da equipe oficial está abordando isso?
Para sua informação, as soluções alternativas não estão funcionando.

O mesmo aqui 0.59.6

Exceção fatal: java.lang.NullPointerException: tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
em android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
em android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
em android.view.View.computeOpaqueFlags (View.java:18188)
em android.view.View.setBackgroundDrawable (View.java:23358)
em android.view.View.setBackground (View.java:23251)
em android.view.View. (View.java:5948)
em android.widget.TextView. (TextView.java:1118)
em android.widget.EditText. (EditText.java:106)
em android.widget.EditText. (EditText.java:102)
em android.widget.EditText. (EditText.java:98)
em android.widget.EditText. (EditText.java:94)
em com.facebook.react.views.textinput.ReactEditText. (ReactEditText.java:89)
em com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:105)
em com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:65)
em com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:47)
em com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:256)
em com.facebook.react.uimanager.UIViewOperationQueue $ CreateViewOperation.execute (UIViewOperationQueue.java:200)
em com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:1109)
em com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.doFrameGuarded (UIViewOperationQueue.java:1080)
em com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:29)
em com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreographer.java:166)
em com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:84)
em android.view.Choreographer $ CallbackRecord.run (Choreographer.java:947)
em android.view.Choreographer.doCallbacks (Choreographer.java:761)
em android.view.Choreographer.doFrame (Choreographer.java:693)
em android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:935)
em android.os.Handler.handleCallback (Handler.java:873)
em android.os.Handler.dispatchMessage (Handler.java:99)
em android.os.Looper.loop (Looper.java:214)
em android.app.ActivityThread.main (ActivityThread.java:7045)
em java.lang.reflect.Method.invoke (Method.java)
em com.android.internal.os.RuntimeInit $ MethodAndArgsCaller.run (RuntimeInit.java:493)
em com.android.internal.os.ZygoteInit.main (ZygoteInit.java:965)

@knspatel Nossa solução alternativa foi sobrepor a tela com um modal que posicionava uma caixa de entrada de texto sobre o original junto com uma leve opacidade de fundo para eliminar o efeito de transição. Se a coordenada y estiver fora de vista ou inacessível, a caixa de entrada de texto fica logo acima do teclado.

Deixe-me recapitular:
O ponto principal é não definir nenhum valor para underlineColorAndroid em qualquer lugar . Mas como 0.57 underlineColorAndroid é definido por padrão , você tem que remover manualmente esta linha através de alguma ferramenta de patch como
E se você ainda quiser tornar o sublinhado invisível, você precisa defini-lo em alguma configuração xml .

E aqui estão algumas informações que encontrei até agora:
Um blog chinês (pode tentar o google tradutor se não souber ler) mencionou um problema muito semelhante a este. Ele disse que alguma classe de drawable personalizada sem a implementação de getConstantState pode causar falha em alguns cenários.

Descobri que às vezes o textinput (ReactEditText) será recriado (mais textinputs mais possibilidades, tipo de reciclagem?), E será setBackground novamente, que então vai para https://github.com/aosp-mirror/ platform_frameworks_base / blob / master / graphics / java / android / graphics / drawable / DrawableContainer.java # L922 , onde ConstantState é nulo.

A única classe drawable personalizada que encontrei é ReactViewBackgroundDrawable e não implementou getConstantState que retornará nulo por padrão.
Tentei sobrescrevê-lo com alguma classe vazia e pode fazer alguma diferença (esta falha desaparece enquanto outras surgem).

Espero que isso possa ajudar alguém a cavar mais.

Descobri que o teste manual é muito incerto e errado, então escrevi um componente para testar automaticamente alguns dos cenários que as pessoas relataram acima. Você encontrará o componente abaixo. Você apenas tem que renderizá-lo em algum lugar para que ele faça seu trabalho.

Ao fazer isso, descobri que você só precisa adicionar o seguinte ao AppTheme em styles.xml, conforme sugerido por @Hopding
<item name="android:editTextBackground"><strong i="7">@android</strong>:color/transparent</item>

Nada mais era necessário e _não havia necessidade_ de evitar a configuração de underlineColorAndroid , portanto, não importava que o React Native agora o configurasse por padrão.

A principal desvantagem dessa correção é que você tem que mudar o estilo de seus TextInputs para permitir a perda de preenchimento resultante, e você também perde o comportamento real do sublinhado, o que para nós foi uma vantagem, pois sempre o definimos como "transparente" para ser consistente com o iOS. Se precisar, você pode fazer um componente de invólucro que observe onFocus e onBlur e faça seu próprio sublinhado.

Minha versão do React Native é 0.57.3

Aqui estão algumas outras coisas que descobri usando meu componente de teste:

1. Eu não consegui causar a falha em meu tablet Android de baixa especificação. No entanto, foi muito fácil de reproduzir no meu telefone Samsung S6 Edge com Android 7. Meu palpite é que há uma condição de corrida que precisa de um dispositivo mais rápido para provocá-la.
2. Rolar as entradas de texto não fez diferença e eu poderia facilmente reproduzir o problema sem usar um ScrollView.
3. Não foi necessário inserir o texto. Simplesmente mudar o foco foi o suficiente para causar o crash.
4. Não fez diferença a cor que você definiu para o sublinhado, mesmo undefined causou a falha, mas talvez você esperasse que, uma vez que o padrão RN agora é "transparente"
5. Ter um número razoável de TextInputs aparecendo ao mesmo tempo fez a diferença com o travamento acontecendo mais rápido com 100, do que apenas 10 na tela.
6. Não consegui reproduzir a falha com displayForMs: 0 sugerindo que ela só ocorre quando TextInputs foram criados recentemente.

Se você não quiser esperar durante o teste, pode capturar a saída de adb logcat e procurar as mensagens do console produzidas pelo componente e o relatório de travamento.

Aqui está meu componente de teste, caso você deseje usá-lo. Os parâmetros de teste são definidos para causar uma falha normalmente em menos de 30 segundos para mim.

/**
 * A test component to reproduce the crash reported at
 * https://github.com/facebook/react-native/issues/17530
 */

import * as React from "react";
import { View, ScrollView, TextInput, Text, StyleSheet } from "react-native";

// These are the test parameters
const params = {
  underlineColors: ["red", undefined, "transparent", "rgba(0, 0, 0, 0)"],  // The colors to test
  numberOfInputs: 100, // How many TextInput to render at a time
  focusIntervalMs: 200, // How often to change focus between them
  displayForMs: 3000, // How long to display them (set to 0 for indefinite)
  delayDisplayForMs: 10, // How long to delay between displays
  withScrollView: false // Whether to use a ScrollView
};

const testText = index =>
  `Testing underlineColor = ${params.underlineColors[index] || "undefined"}`;

class AndroidTextInputTest extends React.Component{
  state = {
    underlineColorIndex: 0,
    showInputs: true,
    startKey: 0
  };
  mounted = false;
  focusInterval = undefined;
  textInputRefs = undefined;
  focussedInputIndex = 0;

  componentDidMount() {
    console.log(`Testing with params = `, JSON.stringify(params));
    this.mounted = true;
    setTimeout(this._showInputs, params.delayDisplayForMs);
    setInterval(this._focusAnInput, params.focusIntervalMs);
  }

  componentWillUnmount() {
    clearInterval(this.focusInterval);
    this.mounted = false;
  }

  _focusAnInput = () => {
    if (this.mounted && this.textInputRefs) {
      if (this.focussedInputIndex >= this.textInputRefs.length) {
        this.focussedInputIndex = 0;
      }
      const textInputRef = this.textInputRefs[this.focussedInputIndex];
      const textInput = this.refs[textInputRef];
      if (textInput) {
        this.focussedInputIndex++;
        this.refs[textInputRef].focus();
      }
    }
  };

  _showInputs = () => {
    if (this.mounted) {
      console.log(testText(this.state.underlineColorIndex));
      this.setState({ showInputs: true });
      if (params.displayForMs) {
        setTimeout(this._unshowInputs, params.displayForMs);
      }
    }
  };

  _unshowInputs = () => {
    this.focussedInputIndex = 0;
    this.textInputRefs = undefined;
    if (this.mounted) {
      let next = this.state.underlineColorIndex + 1;
      if (next === params.underlineColors.length) {
        next = 0;
      }
      this.setState({
        underlineColorIndex: next,
        showInputs: false,
        startKey: this.state.startKey + params.numberOfInputs
      });
      setTimeout(this._showInputs, params.delayDisplayForMs);
    }
  };

  render() {
    const textInputs = [];
    const { underlineColorIndex } = this.state;
    const underlineColor = params.underlineColors[underlineColorIndex];

    const refs = [];

    if (this.state.showInputs) {
      for (let i = 0; i < params.numberOfInputs; i++) {
        const key = this.state.startKey + i + "";
        refs.push(key);
        textInputs.push(
          <TextInput
            ref={key}
            key={key}
            placeholder={key}
            underlineColorAndroid={underlineColor}
            style={styles.textInput}
          />
        );
      }
      if (!this.textInputRefs) {
        this.textInputRefs = refs;
      }
    }

    return (
      <View style={styles.mainView}>
        <Text>{testText(underlineColorIndex)}</Text>
        {params.withScrollView ? (
          <React.Fragment>
            <Text>With ScrollView</Text>
            <ScrollView>{textInputs}</ScrollView>
          </React.Fragment>
        ) : (
          <React.Fragment>{textInputs}</React.Fragment>
        )}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  mainView: {
    flex: 1,
    alignItems: "center"
  },
  textInput: {
    backgroundColor: "white",
    margin: 5,
    width: 300
  }
});

export default AndroidTextInputTest;

Para todos aqueles que procuram uma solução, também posso confirmar essa configuração@android : color / transparent em styles.xml corrigiu o problema.

Para sua informação: estamos usando o React-Native Paper e seu componente TextInput e pudemos definir <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> com segurança sem qualquer efeito no RN-Paper TextInput e não tivemos mais problemas desde então.

Vendo em produção em 0.59.9 .

Crashlytics:

Samsung Galaxy S7 Edge
Android 8.0

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures + 875(DrawableContainer.java:875)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity + 1158(DrawableContainer.java:1158)
       at android.graphics.drawable.DrawableContainer.getOpacity + 433(DrawableContainer.java:433)
       at android.graphics.drawable.InsetDrawable.getOpacity + 258(InsetDrawable.java:258)
       at android.view.View.computeOpaqueFlags + 16809(View.java:16809)
       at android.view.View.setBackgroundDrawable + 21728(View.java:21728)
       at android.view.View.setBackground + 21621(View.java:21621)
       at android.view.View.<init> + 5553(View.java:5553)
       at android.widget.TextView.<init> + 1135(TextView.java:1135)
       at android.widget.EditText.<init> + 107(EditText.java:107)
       at android.widget.EditText.<init> + 103(EditText.java:103)
       at android.widget.EditText.<init> + 99(EditText.java:99)
       at android.widget.EditText.<init> + 95(EditText.java:95)
       at com.facebook.react.views.textinput.ReactTextInputShadowNode.setThemedContext + 76(ReactTextInputShadowNode.java:76)
       at com.facebook.react.uimanager.UIImplementation.createView + 294(UIImplementation.java:294)
       at com.facebook.react.uimanager.UIManagerModule.createView + 462(UIManagerModule.java:462)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.facebook.react.bridge.JavaMethodWrapper.invoke + 372(JavaMethodWrapper.java:372)
       at com.facebook.react.bridge.JavaModuleWrapper.invoke + 158(JavaModuleWrapper.java:158)
       at com.facebook.react.bridge.queue.NativeRunnable.run(NativeRunnable.java)
       at android.os.Handler.handleCallback + 789(Handler.java:789)
       at android.os.Handler.dispatchMessage + 98(Handler.java:98)
       at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage + 29(MessageQueueThreadHandler.java:29)
       at android.os.Looper.loop + 164(Looper.java:164)
       at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run + 232(MessageQueueThreadImpl.java:232)
       at java.lang.Thread.run + 764(Thread.java:764)

Mudando isso:

state = {
  data: []
}

para isso:

constructor(props) {
  super(props);
  this.state = {
    data: []
  };
}

corrigiu o problema para mim. Não tenho certeza porque, porque definir o estado como uma variável de classe deve ser bom? Qualquer um?

@wbodron Não, isso não está relacionado. A falha é aleatória, então você pode pensar que foi embora, mas na verdade não foi. E o ponto-chave que expliquei acima https://github.com/facebook/react-native/issues/17530#issuecomment -500865260

cc @cpojer @shergin @sahrens

Exclua a pasta de construção do Android.
Your_Project> android> app> build

Depois de excluí-lo, execute react-native run-android

deve funcionar bem.
Funcionou para mim: D

Já tentei fazer isso e remover underlineColorAndroid, mas ainda estou com o problema. Alguém com outra solução alternativa?

Esse problema também estava fazendo com que nosso aplicativo travasse na produção. É um bug desagradável, porque é realmente difícil de reproduzir. Encontramos uma solução promissora para nosso aplicativo e gostaria de compartilhar nossas descobertas aqui para poupar algum tempo e frustração aos outros.

Especificações e versões

Esse bug fez com que nosso aplicativo travasse em dispositivos Samsung, Google e LG Android. Recebemos relatórios de falhas das seguintes versões do Android:

• 8.0.0
• 8.1.0
• 7.1.1

Nosso aplicativo está executando:

• react-native : 0,53,0
• react : 16.2.0

O que causa o acidente

Como outros notaram neste tópico, o problema parece ser desencadeado pela renderização de alguma combinação dos componentes TextInput , FlatList e ScrollView . Em nosso caso, temos uma tela contendo um único TextInput renderizado acima de FlatList . Quando um dos itens em FlatList é tocado, o aplicativo navega para uma nova tela contendo um formulário. O componente raiz deste formulário é um ScrollView que contém uma série de TextInput componentes (junto com alguns botões e outros componentes personalizados). Nosso aplicativo trava quando o usuário toca em um desses FlatList itens (observe que isso não acontece _ toda_ vez).
Reproduzir esse problema é difícil. Na verdade, não foi possível fazer isso. Mas sabemos que a falha ocorre neste ponto do fluxo de trabalho, observando nossas gravações de sessão do Appsee.
Como não podemos reproduzir o problema, tivemos que contar com os registros de travamento do Appsee para depurá-lo. Copiei o rastreamento de pilha dos relatórios de falha abaixo (e omiti algumas seções ruidosas). É mais ou menos idêntico aos rastreamentos de pilha postados neste tópico por outros:

0   java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
1   at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:875)
2   at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1158)
3   at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:433)
4   at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:258)
5   at android.view.View.computeOpaqueFlags(View.java:16900)
6   at android.view.View.setBackgroundDrawable(View.java:21824)
7   at android.view.View.setBackground(View.java:21717)
8   at android.view.View.<init>(View.java:5577)
9   at android.widget.TextView.<init>(TextView.java:1144)
...
13  at android.widget.EditText.<init>(EditText.java:96)
14  at com.facebook.react.views.textinput.ReactEditText.<init>(ReactEditText.java:91)
15  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:91)
16  at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance(ReactTextInputManager.java:61)
...
35  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1408)

Fonte do problema

Depois de ler este tópico e fazer algumas horas de pesquisa, encontrei o manipulador underlineColorAndroid prop no arquivo ReactTextInputManager.java :

@ReactProp(name = "underlineColorAndroid", customType = "Color")
public void setUnderlineColor(ReactEditText view, <strong i="44">@Nullable</strong> Integer underlineColor) {
  // Drawable.mutate() can sometimes crash due to an AOSP bug:
  // See https://code.google.com/p/android/issues/detail?id=191754 for more info
  Drawable background = view.getBackground();
  Drawable drawableToMutate = background.getConstantState() != null ?
    background.mutate() :
    background;

  if (underlineColor == null) {
    drawableToMutate.clearColorFilter();
  } else {
    drawableToMutate.setColorFilter(underlineColor, PorterDuff.Mode.SRC_IN);
  }
}

O relatório de bug vinculado ao comentário contém o seguinte rastreamento de pilha:

java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable()' on a null object reference
    at android.graphics.drawable.LayerDrawable$ChildDrawable.<init>(LayerDrawable.java:1723)
    at android.graphics.drawable.LayerDrawable$LayerState.<init>(LayerDrawable.java:1792)
    at android.graphics.drawable.LayerDrawable.createConstantState(LayerDrawable.java:152)
    at android.graphics.drawable.LayerDrawable.mutate(LayerDrawable.java:1652)

Isso corresponde ao rastreamento de pilha que encontramos em nosso aplicativo. Não pretendo entender totalmente o problema subjacente, mas parece provável que a causa de nosso aplicativo travar na produção seja devido ao bug Drawable.mutate() sendo acionado. Isso acontece quando tentamos definir o underlineColorAndroid prop em nosso componente TextInput (e assim invocar o método ReactTextInputManager.setUnderlineColor ).
Nosso aplicativo estava renderizando TextInput com os seguintes adereços, um dos quais era underlineColorAndroid="transparent" :

<TextInput
  ref={this.handleRef}
  value={this.props.value}
  autoCorrect={false}
  autoCapitalize="none"
  underlineColorAndroid="transparent"
  onSubmitEditing={this.handleSubmit}
  onChangeText={this.props.onChangeText}
  onFocus={this.handleFocused}
  onBlur={this.handleBlur}
  clearButtonMode="always"
/>

Como consertamos

Precisamos definir este prop para remover o sublinhado dos componentes TextInput em nosso aplicativo. Mas, com base em nossas descobertas, seu manipulador de prop parecia estar acionando um bug do Android que fazia o aplicativo travar ocasionalmente.
Felizmente, há outra maneira de remover sublinhados de TextInput componentes no Android. Você pode adicionar uma linha ao arquivo android/app/src/main/res/values/styles.xml :

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="67">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
+       <item name="android:editTextBackground"><strong i="68">@android</strong>:color/transparent</item>
    </style>
</resources>

Observe que também vi o seguinte sugerido, mas isso não removeu os sublinhados para nós:

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowExitAnimation"><strong i="73">@android</strong>:anim/fade_out</item>
        <item name="android:windowBackground">@drawable/splash_screen</item>
    </style>

+   <!-- This did *not* work for us... -->
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="74">@android</strong>:color/transparent</item>
+   </style>
</resources>

Isso não resolve o problema subjacente. É apenas uma solução alternativa que envolve evitar o uso do underlineColorAndroid prop em componentes TextInput .
Ainda não posso dizer com certeza se isso realmente funciona, porque não consegui reproduzir o problema localmente. Estaremos implantando essa mudança em uma atualização em nosso aplicativo nas próximas semanas. Depois disso, teremos que esperar um pouco para ver se isso ocorre mais. Vou tentar relatar nossas descobertas.
Boa sorte a todos que estão lutando com esse problema frustrante! Eu espero que isso ajude.

Eu sei como reproduzir essa situação. Clique novamente no formulário como você disse e, em seguida, clique no item na lista plana para entrar no formulário. Repita cerca de dez vezes, e um pouco mais rápido, esse erro ocorrerá. Você pode reproduzir o erro de acordo com o que eu disse.

o que eu posso fazer? estou enfrentando esse problema também!

o mesmo aqui. Enfrentando isso na produção

@ jake41 Tentei reiniciá-lo e funcionou, você tentou reiniciá-lo? Eu enfrento esse problema depois de atualizar meu expo cli, acho que é o problema da versão.

@agrass vou tentar o seu método. Parece promissor.
Mas, meu aplicativo falha muito raro com essa causa. Esse problema sempre faz o app travar? ou às vezes?
A DAU de nosso aplicativo é de cerca de 8k, e isso acontece aproximadamente uma vez por dia. Portanto, é insignificante, mas espero curar o acidente.

Alguém encontrou uma solução de trabalho adequada para isso? Ocorre muito raramente e apenas no componente onde existe um campo de texto.

O problema ainda persiste com React Native 0.60

React Native: 0,59,8
Android: 8.1.0
Dispositivo: Redmi 5 Plus

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures + 875(DrawableContainer.java:875)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity + 1158(DrawableContainer.java:1158)
       at android.graphics.drawable.DrawableContainer.getOpacity + 433(DrawableContainer.java:433)
       at android.graphics.drawable.InsetDrawable.getOpacity + 258(InsetDrawable.java:258)
       at android.view.View.computeOpaqueFlags + 15726(View.java:15726)
       at android.view.View.setBackgroundDrawable + 20536(View.java:20536)
       at android.view.View.setBackground + 20429(View.java:20429)
       at android.view.View.(View.java:5256)
       at android.widget.TextView.(TextView.java:826)
       at android.widget.EditText.(EditText.java:88)
       at android.widget.EditText.(EditText.java:84)
       at android.widget.EditText.(EditText.java:80)
       at android.widget.EditText.(EditText.java:76)
       at com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:89)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance + 105(ReactTextInputManager.java:105)
       at com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance + 65(ReactTextInputManager.java:65)
       at com.facebook.react.uimanager.ViewManager.createView + 47(ViewManager.java:47)
       at com.facebook.react.uimanager.NativeViewHierarchyManager.createView + 256(NativeViewHierarchyManager.java:256)
       at com.facebook.react.uimanager.UIViewOperationQueue$CreateViewOperation.execute + 200(UIViewOperationQueue.java:200)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.dispatchPendingNonBatchedOperations + 1109(UIViewOperationQueue.java:1109)
       at com.facebook.react.uimanager.UIViewOperationQueue$DispatchUIFrameCallback.doFrameGuarded + 1080(UIViewOperationQueue.java:1080)
       at com.facebook.react.uimanager.GuardedFrameCallback.doFrame + 29(GuardedFrameCallback.java:29)
       at com.facebook.react.modules.core.ReactChoreographer$ReactChoreographerDispatcher.doFrame + 166(ReactChoreographer.java:166)
       at com.facebook.react.modules.core.ChoreographerCompat$FrameCallback$1.doFrame + 84(ChoreographerCompat.java:84)
       at android.view.Choreographer$CallbackRecord.run + 1027(Choreographer.java:1027)
       at android.view.Choreographer.doCallbacks + 841(Choreographer.java:841)
       at android.view.Choreographer.doFrame + 769(Choreographer.java:769)
       at android.view.Choreographer$FrameDisplayEventReceiver.run + 1015(Choreographer.java:1015)
       at android.os.Handler.handleCallback + 794(Handler.java:794)
       at android.os.Handler.dispatchMessage + 99(Handler.java:99)
       at android.os.Looper.loop + 176(Looper.java:176)
       at android.app.ActivityThread.main + 6651(ActivityThread.java:6651)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run + 547(RuntimeInit.java:547)
       at com.android.internal.os.ZygoteInit.main + 824(ZygoteInit.java:824)

Tenho o mesmo problema aqui
RN: 0,59,9
Dispositivo: Pixel 2
Android: 9.0

Se for uma tela de formulário, pode ser que esteja esperando definir valores nos inputs, funcionou para mim.

Eu encontrei uma solução. Não tenho certeza se é de longo prazo, mas isso permitirá que vocês trabalhem até que uma solução permanente seja encontrada.
Limpe o seu dinheiro: npm start - --reset-cache
E reinicie o projeto.
Funcionou para mim
Para sua informação, eu não ejetei meu projeto ainda.
Minhas dependências:

"devDependencies": {
"@ types / react": "^ 16.8.23",
"@ types / react-native": "^ 0.57.65",
"babel-preset-expo": "^ 6.0.0",
"texto datilografado": "^ 3.4.5"
},

Usuário do ExpoKit (SDK 34) pesando aqui. Tive esse problema em todas as versões do ExpoKit, incluindo a mais recente. Tentei aplicar essas correções, com algumas modificações e, até agora, tudo bem.

A mudança de estilo acabou sendo um pouco diferente da de @Hopding - basicamente o oposto funcionou para mim. Mudei o estilo ExponentEditText em styles.xml como tal:

<style name="ExponentEditText" parent="<strong i="9">@android</strong>:style/Widget.EditText">
    <item name="android:padding">0dp</item>
    <item name="android:textColorHint">#c8c8c8</item>
    <item name="android:textColor">#000000</item>
    <item name="android:background"><strong i="10">@android</strong>:color/transparent</item>
  </style>

pois a mudança para android:editTextBackground não funcionou (talvez tenha algo a ver com este estilo ExponentEditText já existente). Curiosamente, eu não tive que remendar a configuração padrão da prop de underlineColorAndroid para transparent . Eu tive o problema de preenchimento; no entanto, senti que realmente era uma melhoria, já que não precisava mais lidar com o preenchimento intrínseco do TextInput quando ele está vazio e estou tentando posicionar outros componentes próximos a ele.

Anteriormente, eu era capaz de acionar o erro de maneira confiável por meio de um botão de diagnóstico que adicionei ao nosso aplicativo que adicionava 500 TextInputs a uma SectionList. Eu diria que é acionado 60% das vezes na primeira tentativa, 90% na segunda e 100% na terceira, em minha experiência. Tentei pelo menos 10 vezes sem erro depois de fazer a alteração.

Tenho o mesmo problema aqui
RN: 0.55.4
Dispositivo: MI 8 Lite
Android: 8.1.0

java.lang.NullPointerException: tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
em android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
em android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
em android.view.View.computeOpaqueFlags (View.java:15748)
em android.view.View.setBackgroundDrawable (View.java:20558)
em android.view.View.setBackground (View.java:20451)
em android.view.View.(View.java:5255)
em android.widget.TextView.(TextView.java:826)
em android.widget.EditText.(EditText.java:88)
em android.widget.EditText.(EditText.java:84)
em android.widget.EditText.(EditText.java:80)
em android.widget.EditText.(EditText.java:76)
em com.facebook.react.views.textinput.ReactTextInputShadowNode.setThemedContext (ReactTextInputShadowNode.java:80)
em com.facebook.react.uimanager.UIImplementation.createView (UIImplementation.java:282)
em com.facebook.react.uimanager.UIManagerModule.createView (UIManagerModule.java:366)
em java.lang.reflect.Method.invoke (Method.java)
em com.facebook.react.bridge.JavaMethodWrapper.invoke (JavaMethodWrapper.java:372)
em com.facebook.react.bridge.JavaModuleWrapper.invoke (JavaModuleWrapper.java:160)
em com.facebook.react.bridge.queue.NativeRunnable.run (NativeRunnable.java)
em android.os.Handler.handleCallback (Handler.java:790)
em android.os.Handler.dispatchMessage (Handler.java:99)
em com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage (MessageQueueThreadHandler.java:29)
em android.os.Looper.loop (Looper.java:164)
em com.facebook.react.bridge.queue.MessageQueueThreadImpl $ 3.run (MessageQueueThreadImpl.java:192)
em java.lang.Thread.run (Thread.java:764)

Exceção fatal: java.lang.NullPointerException
Tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo

vivo 1804
Versão Android: 9

Acontecendo para mim. React Native versão 0.60.4 rodando no Android 9. Muito intermitente e raro, entretanto.

Acontecendo para mim. React Native versão 0.60.4 rodando no Android 9. Muito intermitente e raro, entretanto.

O mesmo comigo também ...

O mesmo aqui, React Native 0.60.4 no Android 9

Eu uso React Native com Expo, e tive esse problema esta manhã.
Tentei primeiro colocar esta linha no meu AppTheme styles.xml assim

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="android:editTextBackground"><strong i="9">@android</strong>:color/transparent</item>
</style>

Não funcionou, então procurei outro lugar e finalmente coloquei lá:

<style name="Theme.ReactNative.AppCompat.Light.NoActionBar.FullScreen"
       parent="@style/Theme.ReactNative.AppCompat.Light">
    <item name="android:windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowContentOverlay">@null</item>
  <item name="android:editTextBackground"><strong i="16">@android</strong>:color/transparent</item>
</style>

Parece funcionar perfeitamente bem agora

Este acidente é tão aleatório. Mesmo rastreamento de pilha, v0.60.4. Mesmo erro. Há uma solução? Alguém sugeriu excluir a pasta de construção, mas não vejo o que isso tem a ver com um ponteiro nulo? A solução sempre parece ser uma reconstrução / reexecução

@armagedan @jacobbeasley et al o problema _é_ intermitente, então você pode tentar o componente drop-in fornecido em meu comentário acima para reproduzi-lo. Esse comentário também fornece uma análise do problema e uma solução que funciona para mim e para muitos outros.

@wxjer, tento limpar os dados do aplicativo sobre a configuração e ela está funcionando! você pode tentar

O mesmo aqui, React Native 0.60.4 no Android 9 e Android 8

Qualquer solução?

Caso alguém tenha um bom olho para depuração do Android, aqui está nosso erro de sentinela que acaba de relatar.

reagente nativo 0.60.4

https://sentry.io/share/issue/e0c581e2e99a4ca48199647b8bd3f497/

O mesmo aqui, React Native 0.60.5 no Android 9

Olá! Resolvemos isso removendo a propriedade underlineColorAndroid de nosso TextInput e adicionando esta linha a styles.xml dentro (android / src / main / res / values ​​/ styles.xml)

<item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item>

Este é um relatório de bug?

sim

Você leu as Diretrizes para Contribuição ?

sim, lamento não poder oferecer mais informações sobre essa exceção, exceto para este rastreamento de pilha, porque o relatório de falha foi coletado do google analytics. Não tenho ideia de reaparecer essa exceção.

Meio Ambiente

Meio Ambiente:
SO: macOS Sierra 10.12.6
Nó: 8.4.0
Fio: 0,27,5
npm: 5.4.0
Android Studio: 3.0

Pacotes: (queria => instalado)
reagente nativo: 0,51,0 => 0,51,0
reagir: 16.0.0-alpha.12 => 16.0.0-alpha.12

Plataforma de destino: Android (7.1.1)
móvel: MIX 2
android: 7.1.1
java.lang.NullPointerException:
tentação de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo em
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) em
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) em
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.view.View.drawableStateChanged (View.java:18002) em
android.widget.TextView.drawableStateChanged (TextView.java:4097) em
android.view.View.refreshDrawableState (View.java:18071) em
android.view.View.setPressed (View.java:8543) em
android.view.View.setPressed (View.java:8521) em
android.view.View.onTouchEvent (View.java:11218) em
android.widget.TextView.onTouchEvent (TextView.java:8467) em
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

reac-nativo 0.60.4 eu também

Comecei a encontrar esta falha recentemente, RN 0.60.5, principalmente no Android 8/9 (possivelmente 10 também, não testei extensivamente ainda).

https://github.com/facebook/react-native/issues/17530#issuecomment -504044357 parece funcionar para mim. Normalmente, a falha se apresentaria nas primeiras ~ 5 iterações pelas quais o componente de teste passa. Depois de adicionar essa linha, ele funcionou por aproximadamente 200 iterações sem travar antes de ser interrompido.

editar: usando o componente de teste, também consigo reproduzir isso no Android 6 de maneira confiável, embora, novamente, a correção sugerida pareça resolver o problema.

O mesmo aqui no RN 0.61

Oi pessoal, a solução

Esse problema ainda existe e quebrou meu aplicativo - tudo estava funcionando bem do que eu adicionei uma chamada de busca e agora, mesmo quando eu comento, não consigo fazer o aplicativo funcionar novamente: choro: estou usando Expo btw

EDITAR: Corrigi meu problema para expo reinstalando o aplicativo expo em meu dispositivo

Também encontrou esse erro (RN: 0.61.1, Android 10 api 29). 'npm start --reset-cache' pareceu corrigir.

@johnbowdenatfacet, você pode querer experimentar o componente de teste drop-in fornecido em meu comentário acima para confirmar a correção.

O mesmo problema.

React-Native 0.59.10
Android

java.lang.NullPointerException: tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
em android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
em android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
em android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)

O mesmo problema.

Olá! Resolvemos isso removendo a propriedade underlineColorAndroid de nosso TextInput e adicionando esta linha a styles.xml dentro (android / src / main / res / values ​​/ styles.xml)

<item name="android:editTextBackground"><strong i="7">@android</strong>:color/transparent</item>

Resolvido meu problema, muito obrigado.

Acabei de executar (react-native run-android), que resolveu o problema comigo

Mesmo problema em 0.61.3

Ainda estou enfrentando o problema. Alguns usuários relataram falhas em aplicativos Android, mas isso acontece tão aleatoriamente que não consigo reproduzir.

+1, aconteceu para mim também

@pedrosimao, você pode tentar o componente de teste drop-in fornecido em meu comentário acima para reproduzir a falha de forma confiável. Esse comentário também aponta para uma solução para o problema.

Reduzi o problema de sua entrada para mim, que é importada da base nativa.

Atualizada:
Reiniciei meu PC e telefone e executei novamente, funcionou como um encanto :)

Eu também tive isso. Resolvi o problema executando novamente o Expo via expo r -c

Relatando o mesmo problema para RN 0.59.10

Descobri que o teste manual é muito incerto e errado, então escrevi um componente para testar automaticamente alguns dos cenários que as pessoas relataram acima. Você encontrará o componente abaixo. Você apenas tem que renderizá-lo em algum lugar para que ele faça seu trabalho.

Ao fazer isso, descobri que você só precisa adicionar o seguinte ao AppTheme em styles.xml, conforme sugerido por @Hopding
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>

Nada mais era necessário e _não havia necessidade_ de evitar a configuração de underlineColorAndroid , portanto, não importava que o React Native agora o configurasse por padrão.

A principal desvantagem dessa correção é que você tem que mudar o estilo de seus TextInputs para permitir a perda de preenchimento resultante, e você também perde o comportamento real do sublinhado, o que para nós foi uma vantagem, pois sempre o definimos como "transparente" para ser consistente com o iOS. Se precisar, você pode fazer um componente de invólucro que observe onFocus e onBlur e faça seu próprio sublinhado.

Minha versão do React Native é 0.57.3

Aqui estão algumas outras coisas que descobri usando meu componente de teste:

1. Eu não consegui causar a falha em meu tablet Android de baixa especificação. No entanto, foi muito fácil de reproduzir no meu telefone Samsung S6 Edge com Android 7. Meu palpite é que há uma condição de corrida que precisa de um dispositivo mais rápido para provocá-la.
2. Rolar as entradas de texto não fez diferença e eu poderia facilmente reproduzir o problema sem usar um ScrollView.
3. Não foi necessário inserir o texto. Simplesmente mudar o foco foi o suficiente para causar o crash.
4. Não fez diferença a cor que você definiu para o sublinhado, mesmo undefined causou a falha, mas talvez você esperasse que, uma vez que o padrão RN agora é "transparente"
5. Ter um número razoável de TextInputs aparecendo ao mesmo tempo fez a diferença com o travamento acontecendo mais rápido com 100, do que apenas 10 na tela.
6. Não consegui reproduzir a falha com displayForMs: 0 sugerindo que ela só ocorre quando TextInputs foram criados recentemente.

Se você não quiser esperar durante o teste, pode capturar a saída de adb logcat e procurar as mensagens do console produzidas pelo componente e o relatório de travamento.

Aqui está meu componente de teste, caso você deseje usá-lo. Os parâmetros de teste são definidos para causar uma falha normalmente em menos de 30 segundos para mim.

/**
 * A test component to reproduce the crash reported at
 * https://github.com/facebook/react-native/issues/17530
 */

import * as React from "react";
import { View, ScrollView, TextInput, Text, StyleSheet } from "react-native";

// These are the test parameters
const params = {
  underlineColors: ["red", undefined, "transparent", "rgba(0, 0, 0, 0)"],  // The colors to test
  numberOfInputs: 100, // How many TextInput to render at a time
  focusIntervalMs: 200, // How often to change focus between them
  displayForMs: 3000, // How long to display them (set to 0 for indefinite)
  delayDisplayForMs: 10, // How long to delay between displays
  withScrollView: false // Whether to use a ScrollView
};

const testText = index =>
  `Testing underlineColor = ${params.underlineColors[index] || "undefined"}`;

class AndroidTextInputTest extends React.Component{
  state = {
    underlineColorIndex: 0,
    showInputs: true,
    startKey: 0
  };
  mounted = false;
  focusInterval = undefined;
  textInputRefs = undefined;
  focussedInputIndex = 0;

  componentDidMount() {
    console.log(`Testing with params = `, JSON.stringify(params));
    this.mounted = true;
    setTimeout(this._showInputs, params.delayDisplayForMs);
    setInterval(this._focusAnInput, params.focusIntervalMs);
  }

  componentWillUnmount() {
    clearInterval(this.focusInterval);
    this.mounted = false;
  }

  _focusAnInput = () => {
    if (this.mounted && this.textInputRefs) {
      if (this.focussedInputIndex >= this.textInputRefs.length) {
        this.focussedInputIndex = 0;
      }
      const textInputRef = this.textInputRefs[this.focussedInputIndex];
      const textInput = this.refs[textInputRef];
      if (textInput) {
        this.focussedInputIndex++;
        this.refs[textInputRef].focus();
      }
    }
  };

  _showInputs = () => {
    if (this.mounted) {
      console.log(testText(this.state.underlineColorIndex));
      this.setState({ showInputs: true });
      if (params.displayForMs) {
        setTimeout(this._unshowInputs, params.displayForMs);
      }
    }
  };

  _unshowInputs = () => {
    this.focussedInputIndex = 0;
    this.textInputRefs = undefined;
    if (this.mounted) {
      let next = this.state.underlineColorIndex + 1;
      if (next === params.underlineColors.length) {
        next = 0;
      }
      this.setState({
        underlineColorIndex: next,
        showInputs: false,
        startKey: this.state.startKey + params.numberOfInputs
      });
      setTimeout(this._showInputs, params.delayDisplayForMs);
    }
  };

  render() {
    const textInputs = [];
    const { underlineColorIndex } = this.state;
    const underlineColor = params.underlineColors[underlineColorIndex];

    const refs = [];

    if (this.state.showInputs) {
      for (let i = 0; i < params.numberOfInputs; i++) {
        const key = this.state.startKey + i + "";
        refs.push(key);
        textInputs.push(
          <TextInput
            ref={key}
            key={key}
            placeholder={key}
            underlineColorAndroid={underlineColor}
            style={styles.textInput}
          />
        );
      }
      if (!this.textInputRefs) {
        this.textInputRefs = refs;
      }
    }

    return (
      <View style={styles.mainView}>
        <Text>{testText(underlineColorIndex)}</Text>
        {params.withScrollView ? (
          <React.Fragment>
            <Text>With ScrollView</Text>
            <ScrollView>{textInputs}</ScrollView>
          </React.Fragment>
        ) : (
          <React.Fragment>{textInputs}</React.Fragment>
        )}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  mainView: {
    flex: 1,
    alignItems: "center"
  },
  textInput: {
    backgroundColor: "white",
    margin: 5,
    width: 300
  }
});

export default AndroidTextInputTest;

Tentei fazer isso, mas o teclado não estava aparecendo em TextInputs. Alguma solução?

Obrigado por experimentar meu componente @saketkumar.

Não me lembro se o teclado precisa ser exibido para este teste, embora eu espere que ele apareça quando a entrada de texto estiver focada. Você está usando um dispositivo real ou um emulador?

Você conseguiu ver o cursor aparecendo nas entradas de texto à medida que estavam focadas e o componente foi capaz de reproduzir a falha para você?

O mesmo

Acontece na reação de 0,59 em vários telefones Android.

Ocorre aleatoriamente em componentes com TextInput aninhado em Flatlist

Tentei definir underlineColorAndroid={null} atrribute em TextInput conforme discutido neste tópico, mas o erro persiste

Tive que reiniciar meu telefone e reinstalar o EXPO para que ele fosse consertado. Se isso não funcionar para você, eu tentaria limpar seu cache e limpar o cache do próprio EXPO APP.

Não tenho ideia de como esse ERROR ocorreu em primeiro lugar. Não consegui recriá-lo nem descobrir como evitar que isso acontecesse novamente.
Ele apenas começou e não importa o que eu alterei no meu código, ele não corrigiu. Certamente é o problema com EXPO APP porque vejo o ERROR no APP, mas não no meu console ou em qualquer outro lugar.

+1 Erro ainda existe em RN 0.59.9. relatado pelo Firebase crashlytics

primeiro a obter este erro no RN 0,61?

Obtendo o mesmo erro no RN 0.61, a solução de @diegotsi corrigiu o problema.
Este é um problema sério, já que aconteceu comigo pela primeira vez em um ambiente de pré-produção, e eu nunca teria sido capaz de rastreá-lo sem crashlytics, pois o comportamento errático torna difícil a reprodução.

Este é um relatório de bug?

sim

Você leu as Diretrizes para Contribuição ?

sim, lamento não poder oferecer mais informações sobre essa exceção, exceto para este rastreamento de pilha, porque o relatório de falha foi coletado do google analytics. Não tenho ideia de reaparecer essa exceção.

Meio Ambiente

Meio Ambiente:
SO: macOS Sierra 10.12.6
Nó: 8.4.0
Fio: 0,27,5
npm: 5.4.0
Android Studio: 3.0

Pacotes: (queria => instalado)
reagente nativo: 0,51,0 => 0,51,0
reagir: 16.0.0-alpha.12 => 16.0.0-alpha.12

Plataforma de destino: Android (7.1.1)
móvel: MIX 2
android: 7.1.1
java.lang.NullPointerException:
tentação de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo em
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) em
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) em
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.view.View.drawableStateChanged (View.java:18002) em
android.widget.TextView.drawableStateChanged (TextView.java:4097) em
android.view.View.refreshDrawableState (View.java:18071) em
android.view.View.setPressed (View.java:8543) em
android.view.View.setPressed (View.java:8521) em
android.view.View.onTouchEvent (View.java:11218) em
android.widget.TextView.onTouchEvent (TextView.java:8467) em
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

Este é um relatório de bug?

sim

Você leu as Diretrizes para Contribuição ?

sim, lamento não poder oferecer mais informações sobre essa exceção, exceto para este rastreamento de pilha, porque o relatório de falha foi coletado do google analytics. Não tenho ideia de reaparecer essa exceção.

Meio Ambiente

Meio Ambiente:
SO: macOS Sierra 10.12.6
Nó: 8.4.0
Fio: 0,27,5
npm: 5.4.0
Android Studio: 3.0

Pacotes: (queria => instalado)
reagente nativo: 0,51,0 => 0,51,0
reagir: 16.0.0-alpha.12 => 16.0.0-alpha.12

Plataforma de destino: Android (7.1.1)
móvel: MIX 2
android: 7.1.1
java.lang.NullPointerException:
tentação de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo em
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) em
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) em
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) em
android.graphics.drawable.Drawable.setState (Drawable.java:735) em
android.view.View.drawableStateChanged (View.java:18002) em
android.widget.TextView.drawableStateChanged (TextView.java:4097) em
android.view.View.refreshDrawableState (View.java:18071) em
android.view.View.setPressed (View.java:8543) em
android.view.View.setPressed (View.java:8521) em
android.view.View.onTouchEvent (View.java:11218) em
android.widget.TextView.onTouchEvent (TextView.java:8467) em
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

Isso acontece quando estou mudando algo no estilo, como excluir justifyContent ou smthng como este e reiniciar o aplicativo funciona temporariamente.

@cinocai , @Sargnec et al, este tópico de comentários está ficando tão longo que acho que as pessoas estão perdendo o componente de teste que postei acima

Várias pessoas acima o usaram para reproduzir com sucesso este problema e verificar a solução, que também é mencionada naquele comentário.

@ glenn-axsy: Excelente trabalho com o componente de teste, foi muito útil entender melhor o problema.
Mas estou lutando para encontrar uma solução.

Como você sugeriu ao definir displayForMs: 0 ele não trava. Se eu não estiver errado, ao fazer isso, o 100 TextInputs nunca desmonta (apenas atualizações), nem novos.

Eu tentei definir displayForMs: 3000 sozinho e fiz 2 outras alterações, que mantiveram todos os 100 montados (apenas atualizando) em cada estado definido.

Alterar

• chave const = this.state.startKey + i + ""; ---> chave const = ${i} ;
• Verificação desativada if (this.state.showInputs) { dentro da renderização.

/**
 * A test component to reproduce the crash reported at
 * https://github.com/facebook/react-native/issues/17530
 */

import * as React from 'react';
import { View, ScrollView, TextInput, Text, StyleSheet } from 'react-native';

// These are the test parameters
const params = {
    underlineColors: ['red', undefined, 'transparent', 'rgba(0, 0, 0, 0)'], // The colors to test
    numberOfInputs: 100, // How many TextInput to render at a time
    focusIntervalMs: 200, // How often to change focus between them
    displayForMs: 3000, // How long to display them (set to 0 for indefinite)
    delayDisplayForMs: 10, // How long to delay between displays
    withScrollView: false, // Whether to use a ScrollView
};

const testText = index =>
    `Testing underlineColor = ${params.underlineColors[index] || 'undefined'}`;

class AndroidTextInputTest extends React.Component {
  state = {
    underlineColorIndex: 0,
    showInputs: true,
    startKey: 0,
  };
  mounted = false;
  focusInterval = undefined;
  textInputRefs = undefined;
  focussedInputIndex = 0;

  componentDidMount() {
    console.log('Testing with params = ', JSON.stringify(params));
    this.mounted = true;
    setTimeout(this._showInputs, params.delayDisplayForMs);
    setInterval(this._focusAnInput, params.focusIntervalMs);
  }

  componentWillUnmount() {
    clearInterval(this.focusInterval);
    this.mounted = false;
  }

  _focusAnInput = () => {
    if (this.mounted && this.textInputRefs) {
        if (this.focussedInputIndex >= this.textInputRefs.length) {
            this.focussedInputIndex = 0;
        }
        const textInputRef = this.textInputRefs[this.focussedInputIndex];
        const textInput = this.refs[textInputRef];
        if (textInput) {
            this.focussedInputIndex++;
            this.refs[textInputRef].focus();
        }
    }
  };

  _showInputs = () => {
    if (this.mounted) {
        console.log(testText(this.state.underlineColorIndex));
        this.setState({ showInputs: true });
        if (params.displayForMs) {
            setTimeout(this._unshowInputs, params.displayForMs);
        }
    }
  };

  _unshowInputs = () => {
    this.focussedInputIndex = 0;
    this.textInputRefs = undefined;
    if (this.mounted) {
        let next = this.state.underlineColorIndex + 1;
        if (next === params.underlineColors.length) {
            next = 0;
        }
        this.setState({
            underlineColorIndex: next,
            showInputs: false,
            startKey: this.state.startKey + params.numberOfInputs,
        });
        setTimeout(this._showInputs, params.delayDisplayForMs);
    }
  };

  render() {
    const textInputs = [];
    const { underlineColorIndex } = this.state;
    const underlineColor = params.underlineColors[underlineColorIndex];

    const refs = [];

// CHANGE 2
    // if (this.state.showInputs) {
    for (let i = 0; i < params.numberOfInputs; i++) {
        const key = `${i}`; // CHANGE 1
        refs.push(key);
        textInputs.push(
            <textinput i="23"/>
        );
    }
    if (!this.textInputRefs) {
        this.textInputRefs = refs;
    }
    // }

    return (
        <view i="24">
            <text i="25">{testText(underlineColorIndex)}</text>
            {params.withScrollView ? (
                <react.fragment i="26">
                    <text i="27">With ScrollView</text>
                    <scrollview i="28">{textInputs}</scrollview>
                </react.fragment>
            ) : (
                <react.fragment i="29">{textInputs}</react.fragment>
            )}
        </view>
    );
  }
}

const styles = StyleSheet.create({
    mainView: {
        flex: 1,
        alignItems: 'center',
    },
    textInput: {
        backgroundColor: 'white',
        margin: 5,
        width: 300,
    },
});

export default AndroidTextInputTest;

Ambas as mudanças garantiram que chamar _showInputs e _unshowInputs não remontará os TextInputs, nem montará nenhum novo (máximo 100).
E não trava conforme o esperado.

Finalmente, para ter certeza de que é realmente remontagem (um grande número de TextInputs) que causa o problema. Tentei reproduzi-lo no aplicativo em que estou trabalhando, no qual a falha foi relatada.

No aplicativo há 2 telas, uma com 2 TextInputs e a outra com 4, continuei navegando nas telas, o que, claro, remonta todo o conteúdo da tela e, eventualmente, depois de um tempo, consegui travar.

Com isso, eu poderia inferir que não deixar TextInput desmontar não é uma solução viável. Mas ainda não tenho ideia do que exatamente está causando isso!

NOTA

• Não acho que esteja relacionado à propriedade underlineColorAndroid , porque tentei substituí-la por <item name="android:editTextBackground"><strong i="18">@android</strong>:color/transparent</item> , e nenhuma diferença. [Editado: Na verdade, corrige o problema por enquanto]
• Também consegui travar sem usar ScrollView .
• E focar em TextInput também não era necessário para travar, simplesmente remontar aqueles 100 TextInputs resultava em travamento.

Obrigado!

@rimzici Sim, é verdade. O travamento está relacionado à remontagem / instanciação de um texto de edição, às vezes os drawables de fundo são nulos. Mas, estranhamente, quando você define <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> isso não vai acontecer. Parece que os drawables de alguma forma foram reciclados após a clonagem e, ao definir um fundo, ele pode ter um valor padrão?

Obrigado @rimzici.

É decepcionante saber que simplesmente definir <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> não resolveu para você. Pelo menos você tem uma maneira de reproduzir facilmente o erro agora e pode tentar algumas outras coisas.

Por favor, poste quaisquer observações adicionais que você possa ter.

Obrigado @sunnylqm e @ glenn-axsy! Você está certo, definir <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> realmente corrige.

Esqueci que tinha um tema inicial definido na minha atividade principal, para cobrir a tela branca enquanto o JS carrega.

Agora posso confirmar que a solução alternativa é eficaz na prevenção de travamentos.

Será atualizado com mais informações.

react-native 0.61.5 <- também está aqui!

react-native 0.62.0.rc-1 <- está aqui também!

Mesmo erro em [email protected]

Atingindo muitas ocorrências do mesmo erro capturadas pelo Sentry: https://sentry.io/share/issue/ac1e7c55f1594b118f0faaf8d11de5c4/

Em RN 0.59.9

Mesmo erro em RN 0.55.4

Mesmo problema em RN 2.0.1

não defina adereços 'underlineColorAndroid' para qualquer TextInput e remova todo o fundo de entrada de texto por estilos nativos.

ir para android \ app \ src \ main \ res \ values ​​\ styles.xml

mude como abaixo:

O mesmo em RN 0.61.5

Descobri que o teste manual é muito incerto e errado, então escrevi um componente para testar automaticamente alguns dos cenários que as pessoas relataram acima. Você encontrará o componente abaixo. Você apenas tem que renderizá-lo em algum lugar para que ele faça seu trabalho.

Ao fazer isso, descobri que você só precisa adicionar o seguinte ao AppTheme em styles.xml, conforme sugerido por @Hopding
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>

Nada mais era necessário e _não havia necessidade_ de evitar a configuração de underlineColorAndroid , portanto, não importava que o React Native agora o configurasse por padrão.

A principal desvantagem dessa correção é que você tem que mudar o estilo de seus TextInputs para permitir a perda de preenchimento resultante, e você também perde o comportamento real do sublinhado, o que para nós foi uma vantagem, pois sempre o definimos como "transparente" para ser consistente com o iOS. Se precisar, você pode fazer um componente de invólucro que observe onFocus e onBlur e faça seu próprio sublinhado.

Minha versão do React Native é 0.57.3

Aqui estão algumas outras coisas que descobri usando meu componente de teste:

1. Eu não consegui causar a falha em meu tablet Android de baixa especificação. No entanto, foi muito fácil de reproduzir no meu telefone Samsung S6 Edge com Android 7. Meu palpite é que há uma condição de corrida que precisa de um dispositivo mais rápido para provocá-la.
2. Rolar as entradas de texto não fez diferença e eu poderia facilmente reproduzir o problema sem usar um ScrollView.
3. Não foi necessário inserir o texto. Simplesmente mudar o foco foi o suficiente para causar o crash.
4. Não fez diferença a cor que você definiu para o sublinhado, mesmo undefined causou a falha, mas talvez você esperasse que, uma vez que o padrão RN agora é "transparente"
5. Ter um número razoável de TextInputs aparecendo ao mesmo tempo fez a diferença com o travamento acontecendo mais rápido com 100, do que apenas 10 na tela.
6. Não consegui reproduzir a falha com displayForMs: 0 sugerindo que ela só ocorre quando TextInputs foram criados recentemente.

Se você não quiser esperar durante o teste, pode capturar a saída de adb logcat e procurar as mensagens do console produzidas pelo componente e o relatório de travamento.

Aqui está meu componente de teste, caso você deseje usá-lo. Os parâmetros de teste são definidos para causar uma falha normalmente em menos de 30 segundos para mim.

/**
 * A test component to reproduce the crash reported at
 * https://github.com/facebook/react-native/issues/17530
 */

import * as React from "react";
import { View, ScrollView, TextInput, Text, StyleSheet } from "react-native";

// These are the test parameters
const params = {
  underlineColors: ["red", undefined, "transparent", "rgba(0, 0, 0, 0)"],  // The colors to test
  numberOfInputs: 100, // How many TextInput to render at a time
  focusIntervalMs: 200, // How often to change focus between them
  displayForMs: 3000, // How long to display them (set to 0 for indefinite)
  delayDisplayForMs: 10, // How long to delay between displays
  withScrollView: false // Whether to use a ScrollView
};

const testText = index =>
  `Testing underlineColor = ${params.underlineColors[index] || "undefined"}`;

class AndroidTextInputTest extends React.Component{
  state = {
    underlineColorIndex: 0,
    showInputs: true,
    startKey: 0
  };
  mounted = false;
  focusInterval = undefined;
  textInputRefs = undefined;
  focussedInputIndex = 0;

  componentDidMount() {
    console.log(`Testing with params = `, JSON.stringify(params));
    this.mounted = true;
    setTimeout(this._showInputs, params.delayDisplayForMs);
    setInterval(this._focusAnInput, params.focusIntervalMs);
  }

  componentWillUnmount() {
    clearInterval(this.focusInterval);
    this.mounted = false;
  }

  _focusAnInput = () => {
    if (this.mounted && this.textInputRefs) {
      if (this.focussedInputIndex >= this.textInputRefs.length) {
        this.focussedInputIndex = 0;
      }
      const textInputRef = this.textInputRefs[this.focussedInputIndex];
      const textInput = this.refs[textInputRef];
      if (textInput) {
        this.focussedInputIndex++;
        this.refs[textInputRef].focus();
      }
    }
  };

  _showInputs = () => {
    if (this.mounted) {
      console.log(testText(this.state.underlineColorIndex));
      this.setState({ showInputs: true });
      if (params.displayForMs) {
        setTimeout(this._unshowInputs, params.displayForMs);
      }
    }
  };

  _unshowInputs = () => {
    this.focussedInputIndex = 0;
    this.textInputRefs = undefined;
    if (this.mounted) {
      let next = this.state.underlineColorIndex + 1;
      if (next === params.underlineColors.length) {
        next = 0;
      }
      this.setState({
        underlineColorIndex: next,
        showInputs: false,
        startKey: this.state.startKey + params.numberOfInputs
      });
      setTimeout(this._showInputs, params.delayDisplayForMs);
    }
  };

  render() {
    const textInputs = [];
    const { underlineColorIndex } = this.state;
    const underlineColor = params.underlineColors[underlineColorIndex];

    const refs = [];

    if (this.state.showInputs) {
      for (let i = 0; i < params.numberOfInputs; i++) {
        const key = this.state.startKey + i + "";
        refs.push(key);
        textInputs.push(
          <TextInput
            ref={key}
            key={key}
            placeholder={key}
            underlineColorAndroid={underlineColor}
            style={styles.textInput}
          />
        );
      }
      if (!this.textInputRefs) {
        this.textInputRefs = refs;
      }
    }

    return (
      <View style={styles.mainView}>
        <Text>{testText(underlineColorIndex)}</Text>
        {params.withScrollView ? (
          <React.Fragment>
            <Text>With ScrollView</Text>
            <ScrollView>{textInputs}</ScrollView>
          </React.Fragment>
        ) : (
          <React.Fragment>{textInputs}</React.Fragment>
        )}
      </View>
    );
  }
}

const styles = StyleSheet.create({
  mainView: {
    flex: 1,
    alignItems: "center"
  },
  textInput: {
    backgroundColor: "white",
    margin: 5,
    width: 300
  }
});

export default AndroidTextInputTest;

Pode confirmar que isso corrigiu para mim!

Estou feliz que meu componente de teste e solução sugerida funcionaram para você @gagangoku

Para quem quiser ver no contexto, o link está aqui

Talvez você faça a gentileza de adicionar esse link ao seu comentário.

A correção de @ glenn-axsy funcionou para mim (assim como o componente de teste 👏👏👏), mas tive alguns problemas ao longo do caminho que podem ajudar outra alma perdida:

Meu AppTheme estava sendo substituído indevidamente no arquivo AndroidManifest.xml , devido a um erro que um desenvolvedor cometeu ao adicionar uma atividade na tela inicial. Depois de consertar e confirmar que o AppTheme estava realmente sendo usado (por exemplo, alterando a cor do texto padrão e vendo-o no aplicativo), a correção realmente funcionou.

Muito obrigado e boa sorte!

Acontece comigo usando o Expo. Eu executo este comando.
sudo expo start -c e o problema desapareceu.

@HakimAsa Eu sugiro usar o componente de teste para ter certeza de que realmente foi removido .

O estranho é que o código está funcionando há um mês sem esse problema. Mas depois de alguns recarregamentos repetitivos nas mudanças, tive um problema ontem ... De qualquer forma, vou tentar sua sugestão @ glenn-axsy

No meu caso, estava acontecendo dentro de uma FlatList quando renderItem retorna <TextInput /> . Resolvi esse problema devolvendo <><TextInput /></>

@MahmoudHemaid o problema é tão difícil de reproduzir que você pode não ter realmente resolvido. Mais informações aqui .

android.graphics.drawable.Drawable $ constantstate, newdrawable em um erro de referência nula que aparece enquanto clico em uma imagem, colocada no canto direito. E essa imagem agia como um botão de alternância. Estou usando RN 0.61.2. Alguém por favor me ajude a resolver o problema. isso acontece apenas em apk autônomo

@ glenn-axsy https://github.com/facebook/react-native/issues/17530#issuecomment -504044357

Ao fazer isso, descobri que você só precisa adicionar o seguinte ao AppTheme em styles.xml, conforme sugerido por @Hopding

<item name="android:editTextBackground"><strong i="9">@android</strong>:color/transparent</item>

https://github.com/facebook/react-native/pull/27782#issuecomment -575753501

O exemplo mais simples seria apenas criar um EditText com um AttributeSet nulo e nenhum (0) atributo de estilo padrão:

<strong i="18">@Override</strong>
 protected EditText createDummyEditText() {
   return new EditText(getThemedContext(), null, 0);
 }

ReactTextInput podem ser substituídos por sub-unidades que gostariam de fornecer sua própria instância de EditText .

O construtor de EditText android:

public class EditText extends TextView {
     public EditText(Context context, AttributeSet attrs, int defStyleAttr) {
           this(context, attrs, defStyleAttr, 0);
     }
}

que chama o construtor View ( documentos )

Vou continuar investigando. obrigado

Ei, @glenn-axsy, estou lutando com isso há horas, então realmente espero que você possa me ajudar. Estou usando seu AndroidTextInputTest no meu telefone Android. Estou executando o React Native com Typescript se isso importa e fazendo isso por meio da Expo. Isso significa que não tenho nenhum tipo de coisa EditText.
React nativo em package.json = "react-native": "^ 0.61.4"

Eu usei os parâmetros:

const params = {
underlineColors: ["red", undefined, "transparent", "rgba (0, 0, 0, 0)"], // As cores a serem testadas
numberOfInputs: 100, // Quantos TextInput renderizar por vez
focusIntervalMs: 200, // Com que frequência mudar o foco entre eles
displayForMs: 3000, // Quanto tempo para exibi-los (definido como 0 por tempo indeterminado)
delayDisplayForMs: 10, // Quanto tempo demora entre as exibições
withScrollView: false, // Se deve usar um ScrollView
};

E minha saída antes de obter a "Tentativa de invocar o método virtual" foi:

Testando com params = {"underlineColors": ["red", null, "transparent", "rgba (0, 0, 0, 0)"], "numberOfInputs": 100, "focusIntervalMs": 200, "displayForMs": 3000, "delayDisplayForMs": 10, "withScrollView": false}
Os parâmetros de calendarVisible são verdadeiros e o estado é verdadeiro
Testando underlineColor = red
Testando underlineColor = undefined
Testando underlineColor = transparent
Testando underlineColor = rgba (0, 0, 0, 0)
Testando underlineColor = red
Testando underlineColor = undefined
Testando underlineColor = transparent

Portanto, minha pergunta a partir daqui é: como posso usar esses parâmetros e a saída que vi antes da falha para diagnosticar o que está errado no meu aplicativo?

Obrigado por qualquer ajuda em tudo.

@ucheNkadiCode É um teste para reproduzir rapidamente o problema, não uma solução. A solução é

<item name="android:editTextBackground"><strong i="7">@android</strong>:color/transparent</item>

@ucheNkadiCode É um teste para reproduzir rapidamente o problema, não uma solução. A solução é

<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>

@sunnylqm Estou meio confuso porque estou usando o

Eu uso um TextInput parecido com este:

TextInput
ref = {chave}
chave = {chave}
placeholder = {chave}
underlineColorAndroid = {underlineColor}
style = {styles.textInput}

Obrigado

@ucheNkadiCode

Mas para expo talvez você precise ejetar primeiro para modificar configurações como esta

@ucheNkadiCode

Mas para expo talvez você precise ejetar primeiro para modificar configurações como esta

Sim, esse seria o problema com razão. Não quero pagar o preço de ejetar meu aplicativo nativo de reação tão cedo em seu desenvolvimento. Espero encontrar uma solução que me mantenha no React Native.

Obrigado pela ajuda

@ axsy-dev @ucheNkadiCode

meu comentário estava trabalhando nessa direção, para corrigir isso em uma solicitação pull para evitar os problemas relacionados a TextInput prop underlineColorAndroid . O ReactNative define o tema de forma programática ... reveja meu comentário e volte para mim com alguns comentários, pois não consegui resolver este problema e estou trabalhando em outra solicitação de pull agora. obrigado

Na verdade, consegui resolver esse problema reescrevendo o método de reação nativo ReactTextInput

<strong i="12">@Override</strong>
 protected EditText createDummyEditText() {
   return new EditText(getThemedContext(), null, 0);
 }

Mas isso é apenas desabilitar o estilo passado para o componente EditText com getThemedContext()

além disso, a pilha nos informa que esse erro é acionado por ReactEditText.onTouchEvent , portanto, quando o usuário toca no componente TextInput .

meu comentário estava trabalhando nessa direção, para corrigir isso em uma solicitação pull para evitar os problemas relacionados a TextInput prop underlineColorAndroid . ReactNative define o tema de forma programática ... por favor, revise meu comentário e volte para mim com alguns comentários, pois não consegui resolver este problema e estou trabalhando em outros requisitos de pull agora.

Na verdade, consegui resolver esse problema reescrevendo o método de reação nativo ReactTextInput

<strong i="12">@Override</strong>
 protected EditText createDummyEditText() {
   return new EditText(getThemedContext(), null, 0);
 }

Mas isso é apenas desabilitar o estilo passado para o componente EditText com getThemedContext()

além disso, a pilha nos informa que esse erro é acionado por ReactEditText.onTouchEvent , portanto, quando o usuário toca no componente TextInput .

@ axsy-dev @ fabriziobertoglio1987. Portanto, não tenho nenhum elemento que possa encontrar no diretório do meu projeto com ReactEditText e também não tenho nenhum arquivo .java no meu diretório. Estou usando o TypeScript com React nativo, então a maioria dos meus arquivos são .tsx ou .ts, com exceção de muitos node_modules.

Não estou usando o Native Android, infelizmente.

@ucheNkadiCode para resolver isso agora você precisa ejetar, caso contrário, recriar este cenário em reativo, escrever uma solicitação de pull, ele é mesclado em reagente nativo e depois em expo.

@ucheNkadiCode Receio não usar o Expo, mas parece que @sunnylqm sabe do que está falando

Acabei de enfrentar o mesmo problema na Expo.
Eu tentei: watchman watch-del-all && expo r -c
mas ainda agora boas notícias.

Estou enfrentando o mesmo problema, que desaparece se eu transformar meu TextInput em um texto.

Este comentário de 2 anos atrás ainda é válido.

Eu reduzi para <TextInput> sendo renderizado em uma FlatList. Quando eu substituo isso por <Text> , o problema desaparece.

Redefinir o cache parece ajudar brevemente, mas meu aplicativo travaria novamente após alguns cliques no botão.

Teste @diegoboston com meu componente de teste, você pode reproduzir isso sem FlatList. Você pode encontrar o componente de teste e uma solução alternativa em meu comentário aqui .

Estou usando o expo SDK 37, que usa o react nativo 0,61 internamente.
É estranho que eu não tivesse nenhum problema, mas de repente, quando reiniciei o builder, esse problema apareceu. Ainda não foi corrigido?

RN 0.62.2 + Android mesmo aqui.
Este erro é invocado no modo de produção.

Limpar o cache do app das configurações resolveu meu problema, mas não parece uma solução aceitável para isso.

Trabalhei nessa questão e essas são minhas descobertas (o post anterior

1) Sabemos que adicionar android:editTextBackground com color/transparent ao tema corrige o problema

<item name="android:editTextBackground"><strong i="10">@android</strong>:color/transparent</item>

2) Mudar o ReactEditTextShadowNode method createDummyEditText para o código abaixo também corrige o problema (parece que desabilita todos os estilos de EditText)

<strong i="16">@Override</strong>
 protected EditText createDummyEditText() {
   return new EditText(getThemedContext(), null, 0);
 }

Meu entendimento agora desse problema é que no Android você pode definir estilos de duas maneiras

1) Escrever XML como elementos e estilos html e aplicá-los
2) Chame o construtor EditText ou View e passe o contexto e outros atributos / estilos com ele.

ReactEditText usa createDummyEditText para criar uma instância EditText e, em seguida, alterar alguns estilos (preenchimento, layout ..etc), mas isso é algo relacionado ao layout (preenchimento, margens) e não as cores de fundo, etc. Na verdade, tentei mudar essas linhas de código para setBackgroundTint para red ou transparent e não funcionou ...

https://github.com/facebook/react-native/blob/95546d932f03f9af990c2a11576a4c6297136fd4/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadow.j.jpg

a cor de fundo é alterada com o seguinte método

https://github.com/facebook/react-native/blob/95546d932f03f9af990c2a11576a4c6297136fd4/ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundManager.j51

Na segunda, tentarei novamente alterar o método setBackgroundColor e definir a cor de fundo transparente em tempo de execução ... Essa seria minha primeira dica para resolver este problema

A pilha falha em createInternalEditText

  /**
   * May be overriden by subclasses that would like to provide their own instance of the internal
   * {<strong i="9">@code</strong> EditText} this class uses to determine the expected size of the view.
   */
  protected EditText createInternalEditText() {
    return new EditText(getThemedContext());
  }

createInternalEditText é o último método chamado antes da falha, o resto da pilha é da biblioteca Android SDK OpenSource e não é a causa real do problema

Definir android:editTextBackground provavelmente está apenas substituindo alguns valores de item do tema padrão que está causando o problema. O problema está conectado ao construtor passando getThemedContext que inclui também o tema

<item name="android:editTextBackground"><strong i="17">@android</strong>:color/transparent</item>

Por isso acredito que a solução deve ser buscada em como o React trata o contexto ...

Pessoal, reiniciar o empacotador e limpar o cache funcionou para mim!

Mas esta é a solução temporária, como posso corrigir isso permanente?

Tentei definir programaticamente em java a cor de fundo para transparente, mas ainda dispara o erro de tempo de execução, o que me faz acreditar no código abaixo

<item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item>

é apenas uma lógica de substituição de

https://github.com/facebook/react-native/blob/9312313c3c6701490d728f912e0b0bbd16d91ad9/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadowNode.java

que é claramente a causa do problema na pilha

Esse método é responsável por configurar o estilo do EditText,

O problema é que a pilha de problemas original parece ter um log diferente e parece não estar relacionada ao caso de teste anexado. A pilha abaixo se originou de ReactEditText.onTouchEvent que significa que o usuário está tocando em TextInput e o erro foi disparado.

java.lang.NullPointerException:
tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference at
android.graphics.drawable.DrawableContainer$DrawableContainerState.getChild(DrawableContainer.java:888) at
android.graphics.drawable.DrawableContainer.selectDrawable(DrawableContainer.java:466) at
android.graphics.drawable.StateListDrawable.onStateChange(StateListDrawable.java:104) at
android.graphics.drawable.Drawable.setState(Drawable.java:735) at
android.graphics.drawable.DrawableWrapper.onStateChange(DrawableWrapper.java:331) at
android.graphics.drawable.Drawable.setState(Drawable.java:735) at
android.graphics.drawable.LayerDrawable.onStateChange(LayerDrawable.java:1488) at
android.graphics.drawable.Drawable.setState(Drawable.java:735) at
android.view.View.drawableStateChanged(View.java:18002) at
android.widget.TextView.drawableStateChanged(TextView.java:4097) at
android.view.View.refreshDrawableState(View.java:18071) at
android.view.View.setPressed(View.java:8543) at
android.view.View.setPressed(View.java:8521) at
android.view.View.onTouchEvent(View.java:11218) at
android.widget.TextView.onTouchEvent(TextView.java:8467) at
com.facebook.react.views.textinput.ReactEditText.onTouchEvent(ReactEditText.java:150)

Outros tipos de erros https://github.com/facebook/react-native/issues/17530#issuecomment -376917781

Exceção fatal: java.lang.NullPointerException: tentativa de invocar o método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' em uma referência de objeto nulo no android .graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875) em android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158) em android.graphics.drawable.DrawableContainer.java : 433) em android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258) em android.view.View.computeOpaqueFlags (View.java:16791) em android.view.View.setBackgroundDrawable (View.java:21710) em android.view.View.setBackground (View.java:21603) em android.view.View.(View.java:5547) em android.widget.TextView.(TextView.java:1135) em android.widget.EditText.(EditText.java:107) em android.widget.EditText.(EditText.java:103) em android.widget.EditText.(EditText.java:99) em android.widget.EditText.(EditText.java:95) em com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:92) em com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:94) em com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance () com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:46) em com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:218) em com.facebook.react.uimanager.UIViewOperationQue $ CreateViewOperationQue $. execute (UIViewOperationQueue.java:150) em com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:923) em com.facebook.react.uimanatchOperiewOper.Wava95FacebookOperationRameRameRameViRameRameViRameRameUvvvvvvvat.Uiv.Uiv.Uiv.Uv. em com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:31) em com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreog rapher.java:136) em com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:107) em android.view.Choreographer $ CallbackRecord.run (Choreographer.java:909) em android. view.Choreographer.doCallbacks (Choreographer.java:723) em android.view.Choreographer.doFrame (Choreographer.java:655) em android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:897) em android.os.Handler .handleCallback (Handler.java:789) em android.os.Handler.dispatchMessage (Handler.java:98) em android.os.Looper.loop (Looper.java:164) em android.app.ActivityThread.main (ActivityThread. java: 6938) em java.lang.reflect.Method.invoke (Method.java) em com.android.internal.os.Zygote $ MethodAndArgsCaller.run (Zygote.java:327) em com.android.internal.os.ZygoteInit .main (ZygoteInit.java:1374)

por outro lado, me pergunto se https://github.com/facebook/react-native/issues/17530#issuecomment -504044357 é um exemplo aceitável, pois não causa o erro manualmente clicando em TextInput, mas sim fazendo programaticamente ..

Tenho certeza de que alguém nesta discussão fará uma pesquisa adequada e resolverá esse problema. Muito obrigado e boa sorte! :risonho:

Pessoal, tentem executar "npm install" novamente. Funcionou para mim

Eu tentei adicionar <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> e isso impede o aplicativo de travar, mas a caixa de texto fica piscando entre grande e pequeno e está inutilizável.

No meu caso, eu uso componentes estilizados, defini um nome de adereços como "certo", acho que é especial, mudei para "isRight" resolvi meu problema.

Faça uma versão de lançamento e teste-o naquele apk você nunca viu este erro

O comentário original relata um problema obtido por meio do relatório de bug de análise, e não um erro no desenvolvimento, acho que precisamos manter o foco.

Você pode tentar ambos e qualquer um dos pontos, o que funcionar para seu aplicativo:

1. Exclua os dados de cache do seu aplicativo e deixe-o recarregar
2. Reinicie o servidor usando npm start --reset-cache

https://github.com/facebook/react-native/pull/24183 Tento depurar isso mais uma vez.

https://github.com/facebook/react-native/blob/9f699ae1855252397a516333a35a5e6aff74b89b/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java#L537

parece que há um problema relacionado aberto https://issuetracker.google.com/issues/37068452 no projeto Android

1. Crie uma implementação de Drawable personalizada que não substitua getConstantState ().
2. Crie uma instância LayerDrawable, com uma instância do drawable personalizado como filho.
3. Chame mutate () no LayerDrawable.

    Drawable dummyDrawable = new Drawable() {
        <strong i="12">@Override</strong>
        public void draw(Canvas canvas) {
            canvas.drawColor(Color.RED);
        }
        <strong i="13">@Override</strong> public void setAlpha(int alpha) {}
        <strong i="14">@Override</strong> public void setColorFilter(ColorFilter cf) {}
        <strong i="15">@Override</strong> public int getOpacity() { return 0; }
    };
    LayerDrawable layerDrawable = new LayerDrawable(new Drawable[] { dummyDrawable });
    layerDrawable.mutate();

Em nosso caso, o erro de tempo de execução é disparado nesta linha de ReactEditText (herda de AppCompatEditText )

https://github.com/facebook/react-native/blob/6ffb983f83afdee5d9290c683c5060d2a959818d/ReactAndroid/src/main/java/com/facebook/react/uimanager/ViewManager.java#L83

https://github.com/facebook/react-native/blob/6ffb983f83afdee5d9290c683c5060d2a959818d/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputManager.java#L126

https://github.com/facebook/react-native/blob/6ffb983f83afdee5d9290c683c5060d2a959818d/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactEditText.java#L111

https://github.com/facebook/react-native/issues/17530#issuecomment -615131077

<TextInput style={styles.input} /> enviará as informações do tempo de execução do JavaScript para o Android como JSON por meio do ReactNativeBridge, a API do Android Java usará as informações para criar uma instância View e aumentá-la (exibi-la) na tela.

Ele vai passar um objeto Context para o construtor View que vai inflar o layout deault para aquele <TextInput /> , então a qualquer momento que mudarmos um prop como underlineColorAndroid , nós irá chamar um método específico da API do Android para ex. setUnderlineColorAndroid("red") e a API do Android cuidará da atualização de <TextInput /> cor de sublinhado.

Se 37068452 está causando o Runtime, então devemos ser mutating() a BackgroundDrawable talvez alterando o underlineColor , mas o erro é acionado no construtor View quando passamos o Context .

Tentarei depurar a pilha do Android, mas primeiro tentarei transformar o exemplo atual em um exemplo reproduzível mínimo e remover todas as propriedades que não são essenciais para reproduzir o bug.

Consegui criar um exemplo reproduzível mínimo.
O problema é causado pela propriedade da chave TextInput.

A renderização novamente de um grande número de componentes TextInput com prop chave causará o erro de tempo de execução.
O número de TextInput s parece crucial para acionar a falha.

   // Does not crash after testing for 5 minutes
    for (let i = 0; i < 5; i++) { ..
   // Crashes after 20 seconds
    for (let i = 0; i < 100; i++) { ..
   // Crashes after 1 second
    for (let i = 0; i < 1000; i++) { ..

O acidente não reproduz se remover o TextInput prop chave. Vou investigar e tentar consertar. Execute este exemplo para reproduzi-lo.

import * as React from "react";
import { View, TextInput } from "react-native";

class App extends React.Component{
  state = { startKey: 0 };
  componentDidMount() {
    this.interval = setInterval(this.updateKey, 3000);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  updateKey = () => {
    this.setState({
      startKey: this.state.startKey + 100
    });
  };

  render() {
    const textInputs = [];

    for (let i = 0; i < 100; i++) {
      const key = (this.state.startKey + i).toString();
      console.log("key", key);
      // REMOVE KEY PROP TO FIX THIS
      textInputs.push(
        <TextInput key={key} />
      );
    }

    return (
      <View>
        { textInputs }
      </View>
    );
  }
}

export default App;

O mesmo problema pode ser reproduzido com uma FlatList, se seu data prop inclui um key , index ou id como este [{ key: "1"}, {key: "2"}, .. {key: "5000"}] , automaticamente o key será usado para sua lista e causa o tempo de execução. Remover essas chaves do array data corrige o erro e remove o cache automático.

https://github.com/facebook/react-native/blob/980900c6343b93259e46edd44b6f267aa534cde5/Libraries/Lists/FlatList.js#L122 -L123

import * as React from "react";
import { Text, FlatList, View, TextInput } from "react-native";

class App extends React.Component{
  state = { startKey: 0 };
  componentDidMount() {
    this.interval = setInterval(this.updateKey, 3000);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  updateKey = () => {
    this.setState({
      startKey: this.state.startKey + 100
    });
  };

  render() {
    const textInputs = [];

    for (let i = 0; i < 5000; i++) {
      const notKey = (this.state.startKey + i).toString();
      console.log("key", notKey);
      // REMOVE KEY OR ID FIELD TO FIX THIS
      // replacing notKey with key will trigger the runtime
      textInputs.push(
        { notKey }
      );
    }

    return (
      <FlatList
        data={textInputs}
        renderItem={({item}) => <TextInput value={"testing"} />}
      />
    );
  }
}

export default App;

O problema parece ser causado por esta linha de código. Comentei a linha e a substituí por const key = 500; e o erro não se reproduziu novamente.

https://github.com/facebook/react-native/blob/980900c6343b93259e46edd44b6f267aa534cde5/Libraries/Lists/VirtualizedList.js#L802 -L802

Um exemplo é keyExtractor(item, ii) com item = {"key":"450"} , ii = 50 e o valor de retorno key = 450 causará a falha, mas acredito que esta não seja a causa real, mas apenas indicação de que a chave está causando o problema. Vou continuar investigando isso. Eu estou a procura de um emprego. Muito obrigado. Desejo-te um bom fim de semana.

| COM RUNTIME |
|: -------------------------: |
| |

| SEM RUNTIME |
|: -------------------------: |
| |

@ fabriziobertoglio1987 Tenho uma conclusão semelhante https://github.com/facebook/react-native/issues/17530#issuecomment -573934341, ou seja, relacionada à remontagem / instanciação de um texto de edição. Naquela época, eu não entendia por que a entrada de texto seria recriar / reinstanciar quando parecia não haver razão para isso. Agora parece que as chaves podem ser a causa.

O erro joga daqui

https://github.com/aosp-mirror/platform_frameworks_base/blob/53a9ccaa926945149b4546c67b50ce1ae88ba777/graphics/java/android/graphics/drawable/DrawableContainer.java#L875

onde a matriz mDrawableFutures não é nula, mas alguns de seus elementos filhos podem ser nulos.

mDrawableFutures só pode ser clonado de outros

https://github.com/aosp-mirror/platform_frameworks_base/blob/8857e6b645f9b91f44c8ea0ab8f441c9c0d63da6/graphics/java/android/graphics/drawable/DrawableContainer.java#L800 -L820

o que significa que não era nulo quando estava sendo clonado, mas de alguma forma alguns de seus elementos filho foram destruídos depois.
O seguinte é o meu palpite: Os adereços-chave desencadeariam um processo de diffing, que construiria nós de sombra para entradas de texto. E durante o processo, os estados de drawable seriam clonados. No entanto, pode haver uma condição de corrida / operação sem thread-safe que destruiu alguns dos estados de drawable enquanto eles ainda podem estar em uso. @ fabriziobertoglio1987

muito obrigado @sunnylqm, eu acredito no poder da colaboração e estou tentando conseguir este pull request para encontrar algum trabalho.

Acredito que o problema esteja relacionado a alguns parâmetros sujos passados ​​ao usar key e React.PureComponent.

https://github.com/facebook/react-native/blob/f00795dc90d05180014eeea4b3215b0166a90692/Libraries/Lists/VirtualizedList.js#L345 -L348

https://github.com/facebook/react-native/blob/f00795dc90d05180014eeea4b3215b0166a90692/Libraries/Lists/VirtualizedList.js#L820

https://github.com/facebook/react-native/blob/f00795dc90d05180014eeea4b3215b0166a90692/Libraries/Lists/VirtualizedList.js#L1254 -L1255

Você está certo, na verdade, esse problema só ocorre ao usar o componente TextInput . Por exemplo, substituir TextInput por Text em renderItem corrigirá este problema

<FlatList
  renderItem={({item}) => <TextInput value={"testing"} />}

A diferença entre usar Text e TextInput é que const element será um ForwardRef com TextInput . No caso abaixo TextInput cria um runtime quando atinge uma determinada chave. Também removi underlineColorAndroid="transparent" e não é a causa do erro, mas deixei nos logs abaixo.

https://github.com/facebook/react-native/blob/980900c6343b93259e46edd44b6f267aa534cde5/Libraries/Lists/VirtualizedList.js#L1985 -L1990

console.log("element", element);
//=> element <Text value="testing" />
//=> element <ForwardRef(TextInput) allowFontScaling={true} rejectResponderTermination={true} underlineColorAndroid="transparent" value="testing" />

TextInput retorna um forwardRef

https://github.com/facebook/react-native/blob/f00795dc90d05180014eeea4b3215b0166a90692/Libraries/Components/TextInput/TextInput.js#L1153

https://github.com/facebook/react-native/blob/f00795dc90d05180014eeea4b3215b0166a90692/Libraries/Components/TextInput/TextInput.js#L957 -L990

Acredito que um método na API Java é chamado da API TextInput javascript, mas com parâmetros ausentes / sujos. Isso pode estar causando o erro de tempo de execução do NPE, mas preciso investigar todos os aspectos da API JS TextInput para entender o motivo.

Acho que key prop está causando problemas porque o mecanismo React é baseado na comparação de key prop, se nenhum mecanismo de prop chave estiver presente, então não há cache e subsequente nenhum erro .

Amanhã tentarei definir um ponto de interrupção no seu código no código que você referiu na mensagem acima

Muito obrigado pela ajuda. Esperamos que possamos escrever uma solicitação pull juntos e corrigir esse problema. Desejo a você uma boa noite. Fabrizio

@sunnylqm

MUITO TEMPO NÃO LEIA

Estou escrevendo uma solicitação pull para corrigir esse problema. É muito fácil de consertar.

O problema é causado pelo BackgroundDrawable padrão usado na inicialização do EditText

https://github.com/facebook/react-native/blob/6ffb983f83afdee5d9290c683c5060d2a959818d/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactEditText.java#L111

O Drawable é aquele do tema que estamos usando Theme.AppCompat.Light.NoActionBar . A alteração do Drawable pode ser feita alterando os arquivos xml de modelo usados ​​para inicializar o projeto android react-native com o script init do react-native.

Vou usar qualquer um fornecido por padrão no Android ou vou criar um drawable personalizado e incluí-lo em cada inicialização do projeto.

https://github.com/facebook/react-native/blob/2b56011f9cb9f90781428b5b773cbbed5c4fae43/template/android/app/src/main/res/values/styles.xml#L1 -L6

<item name="android:editTextBackground"><strong i="18">@android</strong>:drawable/edit_text</item>

ou

https://github.com/facebook/react-native/blob/2b56011f9cb9f90781428b5b773cbbed5c4fae43/template/android/app/src/main/res/values/styles.xml#L1 -L6

<item name="android:editTextBackground">@drawable/custom_background_drawable</item>

VERSÃO LONGA

Cito sunnylqm https://github.com/facebook/react-native/issues/17530#issuecomment -660506001

O seguinte é o meu palpite: Os adereços-chave desencadeariam um processo de diffing, que construiria nós de sombra para entradas de texto. E durante o processo, os estados de drawable seriam clonados. No entanto, pode haver uma condição de corrida / operação sem thread-safe que destruiu alguns dos estados de drawable enquanto eles ainda podem estar em uso.

Esta linha android:editTextBackground corrige o erro, mas O QUE esta linha faz no ReactNative?

1) O AndroidManifest.xml atribui o android:theme="@style/AppTheme"

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.awesomeproject">

    <uses-permission android:name="android.permission.INTERNET" />

    <application
      android:name=".MainApplication"
      android:theme="@style/AppTheme">

2) Mudamos AppTheme em res/values/styles.xml

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:textColor">#000000</item>
        <item name="android:editTextBackground"><strong i="22">@android</strong>:drawable/edit_text</item>
    </style>
</resources>

3) EditText construtor irá chamar super(context) . O objeto context inclui layout e theme ( AppTheme ).

O construtor View obterá as informações de estilo / tema / layout do objeto context e criará uma instância de EditText com esses estilos (xml é como html), aumente e exibi-lo na tela.

O Android usa xml como html para renderizar visualizações estáticas, enquanto Java é usado para renderizar conteúdo dinâmico (como JavaScript na Web).

https://github.com/facebook/react-native/blob/6ffb983f83afdee5d9290c683c5060d2a959818d/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactEditText.java#L111

4) ReactNative baseia-se na API Context , mas usará o mesmo padrão de 1-3.
Inicialize as visualizações com o objeto context , em seguida, use JavaScript para fazer alterações dinâmicas sem alterar a instância context diretamente, mas usando a ponte react-native por meio da API Android.

| ANTES | DEPOIS | DEPOIS com adereços de estilo TextInput |
|: -------------------------: |: -------------------- -----: |: -------------------------: |
| | | |

Estou preparando uma solicitação pull para alterar o Drawable padrão usado para EditText na inicialização.
O Drawable do Theme Theme.AppCompat.Light.NoActionBar está causando esse problema; substituí-lo por outro drawable deve corrigi-lo. O drawable <strong i="27">@android</strong>:drawable/edit_text é muito alto para nosso projeto. A vista pai se adapta à altura padrão do drawable se a altura for maior que a do pai. Acredito que o ReactNative está usando um drawable padrão com altura baixa e, em seguida, adaptando-o com match_parent para a visualização pai.

1) OPÇÃO 1 - Encontre um drawable de outro tema

2) OPÇÃO 2
Crie um novo drawable no template react-native baseado naquele disponível no projeto android com altura baixa para sempre match_parent View.

Eu adicionei ao meu projeto android o seguinte drawable com alguns pixels de altura

O drawable de fundo se adapta à altura da vista pai de 10

O drawable de fundo se adapta à altura da vista pai de 100

parece funcionar com pequenos drawables de fundo, então precisamos apenas do script react-native init para inicializar projetos usando este drawable de fundo por padrão. Vou adicionar as alterações explicativas acima aos arquivos abaixo em uma solicitação de pull.

https://github.com/facebook/react-native/blob/2b56011f9cb9f90781428b5b773cbbed5c4fae43/template/android/app/src/main/res/values/styles.xml#L1 -L6

Muito obrigado. Fabrizio

Enfrentando o mesmo problema com RN 0.61.0 + API Android nível 28.
Eu reduzi para alguma combinação de renderizações Flatlist, TextInput e Component aninhado

@ fabriziobertoglio1987 eu tentei dessa forma, mas talvez não tenha percebido que não fiz funcionar. Eu sei pouco sobre o Android e fico feliz que você possa corrigi-lo. Enquanto eu ainda estou interessado na questão dos acessórios principais.

@ fabriziobertoglio1987 Existe

@ asmi24886 você pode encontrar um componente de teste para reproduzir este problema de forma confiável e uma solução alternativa de código / configuração nativo em meu comentário aqui
Não acho que haja uma solução alternativa usando apenas código JS.

Esta é a continuação da minha mensagem anterior https://github.com/facebook/react-native/issues/17530#issuecomment -660908150, meus esforços para encontrar um trabalho freelance e escrever a solicitação de pull para fechar este problema.

Criei um drawable personalizado com base em Theme.AppCompat.Light .

<inset xmlns:android="http://schemas.android.com/apk/res/android"
       android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
       android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
       android:insetTop="@dimen/abc_edit_text_inset_top_material"
       android:insetBottom="@dimen/abc_edit_text_inset_bottom_material">

    <selector>
        <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
        <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
        <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
    </selector>

</inset>

O Runtime é causado pela seguinte entrada, se eu remover esta linha, uma cópia exata do Drawable atual de react-native funciona e não aciona o Runtime Error. Incluí o exemplo reproduzível mínimo em meu https://github.com/facebook/react-native/issues/17530#issuecomment -660017858

<item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

Estou escrevendo uma solicitação pull. Assim que ela for mesclada, você poderá atualizar com o auxiliar de atualização .

O Pull Request incluirá uma reprodução desses cenários no aplicativo RNTester, alterações no modelo e adição do drawable personalizado acima para evitar esse problema.

https://github.com/facebook/react-native/blob/2b56011f9cb9f90781428b5b773cbbed5c4fae43/template/android/app/src/main/res/values/styles.xml#L1 -L6

Este é um vídeo mostrando o erro de execução quando o Drawable tem a linha <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

Este é um vídeo que mostra a correção (sem erro de tempo de execução) quando o Drawable não tem a linha <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

Conforme exibido na captura de tela abaixo, estou apenas removendo a seguinte linha do arquivo xml drawable
xml <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
Não estou mudando o estilo. O Drawable é o mesmo usado no AppCompat e o estilo será o mesmo, mas não acionará o erro de tempo de execução

Tentarei publicar a solicitação pull amanhã .

Muito obrigado sunnylqm por colaborar comigo para escrever https://github.com/facebook/react-native/pull/29452 que resolve este problema.

Parece haver um bug em Drawable.mutate () em alguns dispositivos / versões do sistema operacional Android, mesmo depois de verificar o estado constante. Este erro é difícil de reproduzir e corrigir, portanto, tente capturar a exceção para evitar travamento.

O problema é causado por esta linha em extras / android / support / v7 / appcompat / res / drawable / abc_edit_text_material.xml .

<item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

A linha acima cria um StateListDrawable que mudará a imagem de fundo TextInput (Background Drawable ) dependendo do estado de TextInput .

state_pressed="false" e state_focused="false" irão acionar uma mudança no TextInput BackgroundDrawable. As imagens não são a causa do problema, mas eu as incluí para fins de documentação.

| abc_textfield_activated_mtrl_alpha | abc_textfield_default_mtrl_alpha |
|: -------------------------: |: -------------------- -----: |
| | |

Dentro de DrawableContainer.getChild () a variável cs ConstantState é null . Chamar null.newDrawable(mSourceRes) dispara uma exceção de ponteiro nulo. Esta chamada é o resultado da mudança de estado do TextInput, neste stack trace após pressioná-lo.

mDrawableFutures não inclui a lista correta de entradas https://github.com/facebook/react-native/pull/29452#issuecomment -662616018.

final ConstantState cs = mDrawableFutures.valueAt(keyIndex);
final Drawable prepared = prepareDrawable(cs.newDrawable(mSourceRes));

Mais informações nos comentários anteriores https://github.com/facebook/react-native/issues/17530#issuecomment -661174770 https://github.com/facebook/react-native/issues/17530#issuecomment -660908150 https: //github.com/facebook/react-native/issues/17530#issuecomment -660506001 https://github.com/facebook/react-native/issues/17530#issuecomment -660458191 https://github.com/facebook/ react-native / issues / 17530 # issuecomment -660017858 https://github.com/facebook/react-native/issues/17530#issuecomment -659422298 https://github.com/facebook/react-native/issues/17530# issuecomment -645851033 https://github.com/facebook/react-native/issues/17530#issuecomment -632795323

Muito obrigado
Eu desejo-lhe um bom dia
Fabrizio

@ fabriziobertoglio1987 O comentário acima é uma solução alternativa ou uma correção realmente implementável que precisa ser adicionada para reagir nativo, estamos atualmente no RN 0.59.3 e estamos obtendo este erro apenas no uso de produção. Parece que não podemos nos replicar no desenvolvimento.

@Coffeegerm O comentário acima https://github.com/facebook/react-native/issues/17530#issuecomment -662000718 é uma breve explicação de como minha solicitação de pull https://github.com/facebook/react-native/pull / 29452 corrige esse problema. Uma vez que a solicitação pull é mesclada em reagente nativo

1) Novos aplicativos não terão este erro
2) Os aplicativos existentes serão atualizados e não terão o erro. Leia mais sobre como atualizar em atualizar # 3-upgrade-your-project-files para saber mais sobre como aplicar as alterações em sua pasta /android ao atualizar seu aplicativo.

Se você não quiser atualizar, você pode verificar minha pasta PR https://github.com/facebook/react-native/pull/29452 e adicionar essas alterações à pasta android seu projeto. Você não precisa fazer alterações no código fonte react-native , já que as alterações de configuração deste PR não estão na base de código /ReactAndroid Java, mas no modelo Android usado para inicializar o projeto.

No momento, estou trabalhando em outros problemas, mas voltarei, responderei a qualquer feedback e farei as melhorias necessárias em minha solicitação pull.

Por favor, volte para mim com qualquer sugestão de melhoria e feedback.

desejo-te um bom fim de semana
Muito obrigado por sua ajuda
Fabrizio

Acabei de ver um commit que parece relacionado https://github.com/facebook/react-native/commit/1e4d8d902daca8e524ba67fc3c1f4b77698c4d08

estávamos gerando estritamente muitas operações Criar + Excluir que eram redundantes e poderiam causar problemas de consistência, travamentos ou bugs em plataformas que não lidam com isso normalmente -
especialmente porque a ordem de Criar + Excluir não é garantida (uma visão reparada poderia ser criada "primeiro" e, em seguida, a diferença poderia posteriormente emitir uma "exclusão" para a mesma visão).

@ fabriziobertoglio1987

Alguma ideia de como alguém poderia consertar esse problema durante o uso do Expo, portanto, sem acesso à pasta android do projeto? 😅

@divonelnc Há uma solução alternativa: use uma nova chave toda vez que uma entrada de texto for renderizada, por exemplo,

<TextInput key={Math.random()} />

E, claro, pode causar alguns outros problemas e perda de desempenho.

@sunnylqm Infelizmente isso não ajudou 😞. Ainda estou tendo travamento aleatório na tela com dezenas de entradas de texto.

Posso confirmar esse problema na produção! RN: 0,62,2 😕

O mesmo problema ocorreu em RN 0.63.2 :(

Este commit pode corrigir este problema:
https://github.com/facebook/react-native/commit/a5b5d1a805a9c54d325763b432be1cf2c8811dc9

Mesmo problema com Expo e RN sdk https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz

Uau, isso foi frustrante. @WilliamAlexander @Hopding solução funciona. Eu sei porque eu poderia reproduzi-lo todas as vezes antes.
// styles.xml

<resources>
   <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:editTextStyle">@style/AppEditTextStyle</item>
        <item name="editTextStyle">@style/AppEditTextStyle</item> <!-- For compatibility with the support library -->
        <item name="android:editTextBackground"><strong i="9">@android</strong>:color/transparent</item>

    </style>

    <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
        <item name="android:background"><strong i="10">@android</strong>:color/transparent</item>
    </style>
</resources>

Aqui está uma boa solução alternativa. Faça um invólucro para qualquer componente de entrada de texto que estiver usando e gere uma chave para ele com useMemo. Desta forma, uma única entrada de texto sempre terá a mesma chave por meio de re-renderizações, e você não precisa escrever chaves para todas as suas entradas de texto.

export default (props: TextInputProps) => {
  const key = useMemo(() => {
    return Math.random().toString()
  }, [])

  return (
    <TextInput key={key} {...props} />
  )
}

Se você estiver usando o Expo
Recebi este erro depois de atualizar do expo SDK 38 para o 39.
Eu tive que limpar o cache do expo (expo -rc) + o cache do aplicativo móvel expo (eu desinstalo e reinstalo para ter certeza) e o erro desapareceu.

@dpnick o bug é muito difícil de reproduzir. Eu sugiro usar o componente de teste que postei aqui para ter certeza de que realmente funcionou.

Recebo esse erro na produção e não consigo reproduzir esse problema, minha versão RN é 0.62.2, aqui estão meus registros do firebase crashlytics:

Fatal Exception: java.lang.NullPointerException: Attempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)' on a null object reference
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.createAllFutures(DrawableContainer.java:880)
       at android.graphics.drawable.DrawableContainer$DrawableContainerState.getOpacity(DrawableContainer.java:1163)
       at android.graphics.drawable.DrawableContainer.getOpacity(DrawableContainer.java:434)
       at android.graphics.drawable.InsetDrawable.getOpacity(InsetDrawable.java:259)
       at android.view.View.computeOpaqueFlags(View.java:19424)
       at android.view.View.setBackgroundDrawable(View.java:24701)
       at android.view.View.setBackground(View.java:24594)
       at android.view.View.<init>(View.java:6191)
       at android.widget.TextView.<init>(TextView.java:1223)
       at android.widget.EditText.<init>(EditText.java:106)
       at android.widget.EditText.<init>(EditText.java:102)
       at android.widget.EditText.<init>(EditText.java:98)
       at android.widget.EditText.<init>(EditText.java:94)
       at com.facebook.react.views.textinput.ReactTextInputShadowNode.createInternalEditText(ReactTextInputShadowNode.java:258)
       at com.facebook.react.views.textinput.ReactTextInputShadowNode.setThemedContext(ReactTextInputShadowNode.java:78)
       at com.facebook.react.uimanager.UIImplementation.createView(UIImplementation.java:243)
       at com.facebook.react.uimanager.UIManagerModule.createView(UIManagerModule.java:469)
       at java.lang.reflect.Method.invoke(Method.java)
       at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:372)
       at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:151)
       at com.facebook.react.bridge.queue.NativeRunnable.run(NativeRunnable.java)
       at android.os.Handler.handleCallback(Handler.java:883)
       at android.os.Handler.dispatchMessage(Handler.java:100)
       at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:27)
       at android.os.Looper.loop(Looper.java:237)
       at com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run(MessageQueueThreadImpl.java:226)
       at java.lang.Thread.run(Thread.java:919)

@AbdelkhalekESI o bug é muito difícil de reproduzir. Você experimentou o componente de teste que postei aqui ?

Escrevi uma solicitação de pull que corrige esse problema https://github.com/facebook/react-native/issues/17530#issuecomment -663577143

Acesse a pr https://github.com/facebook/react-native/pull/29452 siga as instruções https://github.com/facebook/react-native/wiki/Building-from-source#publish - your-own-version-of-react-native e me avise se precisar de ajuda. Tentarei verificar neste fim de semana se um pr separado precisa ser escrito para a Expo, mas acredito que eles só conseguirão a correção atualizando o reactnative assim que este pr for fundido e lançado. Muito obrigado. eu te desejo uma boa noite

mais informações em minhas postagens anteriores https://github.com/facebook/react-native/issues/17530#issuecomment -662000718

Mesmo problema na versão "react-native": "0.63.3"

apenas limpe o cache do Expo no aplicativo móvel (se você usar o aplicativo móvel) ou o cache do aplicativo Expo em qualquer plataforma que você usar.

@ tzeneng96 ok, limpar o cache funciona com o aplicativo, mas não é uma solução aceitável, porque o problema ocorre novamente!

@AbdelkhalekESI o bug é muito difícil de reproduzir. Você experimentou o componente de teste que postei aqui ?

Consegui reproduzir esse bug usando este componente. Também recebi muitos registros dessa falha na produção. O projeto atualmente reage na versão 0.63.3.

Não sei se entendi errado, mas neste tópico citado por @ glenn-axsy, pelo que entendi eles conseguiram resolver adicionando andoid \ app \ src \ main \ res \ values ​​\ styles.xml o item:
"item name =" android: editTextBackground "> @ android: color / transparent / item"

Ainda estou testando a solução.

@thiagocristianno seu entendimento está correto, embora não seja uma solução perfeita e eu acredito que não ajude os desenvolvedores da Expo porque eles não podem controlar esse ambiente.

Uau, isso foi frustrante. @WilliamAlexander @Hopding solução funciona. Eu sei porque eu poderia reproduzi-lo todas as vezes antes.
// styles.xml

<resources>
   <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:editTextStyle">@style/AppEditTextStyle</item>
        <item name="editTextStyle">@style/AppEditTextStyle</item> <!-- For compatibility with the support library -->
        <item name="android:editTextBackground"><strong i="10">@android</strong>:color/transparent</item>

    </style>

    <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
        <item name="android:background"><strong i="11">@android</strong>:color/transparent</item>
    </style>
</resources>

@ @jordangrant , onde você viu a solução alternativa?

Uau, isso foi frustrante. @WilliamAlexander @Hopding solução funciona. Eu sei porque eu poderia reproduzi-lo todas as vezes antes.
// styles.xml

<resources>
   <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="android:editTextStyle">@style/AppEditTextStyle</item>
        <item name="editTextStyle">@style/AppEditTextStyle</item> <!-- For compatibility with the support library -->
        <item name="android:editTextBackground"><strong i="11">@android</strong>:color/transparent</item>

    </style>

    <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
        <item name="android:background"><strong i="12">@android</strong>:color/transparent</item>
    </style>
</resources>

@ @jordangrant , onde você viu a solução alternativa?

@bobowinca Este é um tópico extremamente longo e aquela solução funcionou 100% para mim. RN 63.3 no Expo

@jordangrant , Doh! Sempre olhe antes de perguntar. Eu falhei. Obrigado senhor.

Também parece que você conseguiu reproduzir o problema de forma consistente. Estou me perguntando como você faz isso. Eu só vi rastreamento de pilha até agora. Estou descobrindo maneiras de verificar a correção.

@bobowinca o componente de teste que postei aqui deve ajudá-lo a reproduzi-lo de forma consistente.

@bobowinca o componente de teste que postei aqui deve ajudá-lo a reproduzi-lo de forma consistente.

Funciona como um encanto! Obrigado Glenn!

Adicionar <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> ao styles.xml está funcionando!
O método com adição ao key={Math.random().string()} do TextInput estava funcionando, mas os re-renderizadores causam a ocultação do teclado a cada segundo - era inaceitável.