react-native 🚀 - NullPointerException: tenta a invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable....

Enfrentando el mismo problema.

Kshitij-Jain en 11 ene. 2018

👍4

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

yaronlevi en 15 ene. 2018

👍24

Mismo problema

fatiherdogan01 en 16 ene. 2018

Mismo problema. Mismo logtrace

sospedra en 23 ene. 2018

Lo mismo aquí en RN 44.0

sahil290791 en 7 feb. 2018

👍3

+1 anotha 'uno

thiZguy en 8 feb. 2018

¡Los chicos que reiniciaron el empaquetador y borrar la caché funcionaron para mí!

thiZguy en 8 feb. 2018

👎150 👍54 😕13 🚀10 ❤8 🎉5 😄1

El mismo problema para mí. Estoy usando RN 0.51.0 y react-native-material-textfield 0.12.0.

fodjan-philip en 21 feb. 2018

Yo también estoy enfrentando estos problemas. Lo extraño es que es muy difícil rastrear el error ya que el rastreo de la pila no contiene ninguna información útil. Incluso no sé dónde podría estar el error.
Actualizaré aquí si encuentro la solución

szholdiyarov en 23 feb. 2018

👍4

El mismo error ocurre en RN 0.52.0.

honzababarik en 23 feb. 2018

¡Gracias por publicar esto! Parece que no está utilizando la última versión de React Native, v0.53.0, lanzada en enero de 2018. ¿Puede asegurarse de que este problema aún se pueda reproducir en la última versión?

Voy a cerrar esto, pero no dude en abrir un nuevo problema si puede confirmar que sigue siendo un problema en la v0.53.0 o más reciente.

_{Cómo contribuir • Qué esperar de los encargados del mantenimiento}

react-native-bot en 24 feb. 2018

👎242 😕20 😄8 👍6 👀4

Mismo problema en 0.53.3

Gentlee en 27 feb. 2018

👍48

Mismo problema

yuanboGeng en 2 mar. 2018

👍3

@ react-native-bot Necesidad de volver a abrir el problema

SoundBlaster en 3 mar. 2018

👍58

enfrenta el mismo problema con Android 8

sksahil030 en 6 mar. 2018

Igual que aquí. Reaccionar nativo 0.53.3, SM-T550, API nivel 25 (Android 7.0)

rknell en 9 mar. 2018

👍2

este problema acaba de aparecer conmigo, React native 0.53.3 - Android 8.1.

mhdtouban en 11 mar. 2018

Reaccionar nativo 0.53.3, android 8, mismo problema

sshkalikov en 13 mar. 2018

El mismo problema, react-native 0.53.0 y android 8. Es extraño porque este error parece aparecer aleatoriamente. No puedo encontrar ningún paso exacto para reproducirlo.

iBuntaah en 20 mar. 2018

👍10 😄5 ❤3 😕3

Tiene una aplicación de producción que ejecuta RN 0.54.2 y esto parece afectar a algunos usuarios que ejecutan Android 8.0.0 al iniciar la aplicación.

selection_024

jamsch en 20 mar. 2018

👍37

¿Por qué está cerrado este problema? Algunos de nosotros enfrentamos este problema en el entorno de producción, por lo que "reiniciar el empaquetador" no es una solución aceptable.

m-vdb en 26 mar. 2018

👍164 😕15 👀5

Este problema debe reabrirse ya que afecta a la versión actual.

JCMais en 28 mar. 2018

👍59

También estoy enfrentando rastros de pila que podrían 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?

jgcmarins en 28 mar. 2018

👍23

El mismo problema aquí android 8.0 api 26

j-mendez en 28 mar. 2018

Lo mismo en 0.54.2.

Lo he reducido a un <TextInput> se representa en una FlatList. Cuando reemplazo esto con <Text> , el problema desaparece.

lukebarnard1 en 2 abr. 2018

👍38 👀10 👎3 😕2

Reproduzca con la última versión disponible ahora y lo volveré a abrir.

radko93 en 10 abr. 2018

Lo mismo aquí @ radko93

API 27 de Android 8.1

"dependencias": {
"reaccionar": "16.3.1",
"react-native": "0.55.1",
"react-native-linear-gradient": "^ 2.4.0",
"react-native-vector-icons": "^ 4.6.0",
"react-navigation": "^ 1.5.11"
},

Intenta invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo
createAllFutures
DrawableContainer. java: 875
getOpacity
DrawableContainer. java: 1158
getOpacity
DrawableContainer. java: 433
getOpacity
InsetDrawable. java: 258
computeOpaqueFlags
Ver. java: 15698
setBackgroundDrawable
Ver. java: 20502
Definir fondo
Ver. java: 20395

Ver. java: 5238

Vista de texto. java: 826

Editar texto. java: 88

Editar texto. java: 84

Editar texto. java: 80

Editar texto. java: 76
setThemedContext
ReactTextInputShadowNode. java: 80
createView
Implementación de UII. java: 282
createView
UIManagerModule. Java: 366
invocar
Method.java
invocar
JavaMethodWrapper. Java: 372
invocar
JavaModuleWrapper. java: 160
correr
NativeRunnable.java
handleCallback
Manipulador. java: 790
dispatchMessage
Manipulador. java: 99
dispatchMessage
MessageQueueThreadHandler. java: 29
lazo
Looper. java: 164
correr
MessageQueueThreadImpl. java: 192
correr
Hilo. java: 764

redkiil en 11 abr. 2018

👍2

Mismo problema

package.json
"dependencias": {
"reaccionar": "16.3.1",
"react-native": "0.55.2",
},

build.gradle
compileSdkVersion 26
buildToolsVersion "26.0.2"
minSdkVersion 16

jeffnian88 en 12 abr. 2018

Mismo 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

fenglu09 en 23 abr. 2018

Mismo problema.

selection_007

russpitre en 25 abr. 2018

mismo problema, en el entorno de producción, mi dispositivo es HUAWEI (LLD-AL10) 8.0.0, actualmente estoy usando React Native 0.46.2, gracias

iamdurui en 27 abr. 2018

Obteniendo el mismo problema cuando se usa la última versión de react-native (0.55.3). El problema parece estar relacionado con TextInput en una FlatList como se mencionó anteriormente. Obteniendo el error en Android 8.0 y 8.1. ¿Alguna solución alternativa para evitar este problema?

azhadm en 27 abr. 2018

👍1

Puedo reproducir este error creando un nuevo proyecto React Native con react-native init y cambiando App.js a

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>
    );
  }
}

Estaba ejecutando esto en un Galaxy S8 con Android 8.0.0 desde MacOS 10.13.3.

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

No sé si el error no está directamente relacionado con la cantidad de TextInputs, pero esta es la única forma en que podría reproducir este error de una manera bastante confiable. Con 128 entradas no recibí este error en cada reinicio, pero después de algunas recargas apareció. En 256 TextInputs desnudos, no creo que haya podido iniciar la aplicación sin obtener el error. También noté que agregar elementos entre TextInputs parecía reducir la probabilidad de obtener este error, por lo que es probable que no esté directamente relacionado con la cantidad de TextInputs. Intenté esto en mi aplicación actual y agregar cientos de TextInputs a la pantalla de inicio también desencadenó este error, pero mis otras vistas con cantidades similares de TextInputs envueltas en otros elementos no siempre parecen desencadenar este error, ya que tengo algunas en mi aplicación. .

Djiffit en 30 abr. 2018

👍23

Tengo el mismo problema. Estaba ejecutando esto en un Huawei P10 con Android 8.0.0.
"react": "^16.2.0", "react-native": "^0.55.0",
Captura de pantalla

ahanusek en 4 may. 2018

👍3

Parece que el problema está en TextInputs. Esto sucede en mi Huawei P10 (Android 8.0.0). ¿Existe ya una solución para esto?

pjconcepcion en 5 may. 2018

👍1

Android: 7.1.1
"react-native": "0.53.3",

daimashenjing en 8 may. 2018

👍2

¡Gracias por publicar esto! Parece que su problema puede referirse a una versión anterior de React Native. ¿Puede reproducir el problema en la última versión, v0.55 ?

Gracias por sus aportaciones.

react-native-bot en 15 may. 2018

👎47 😄3 😕2

Estoy enfrentando el mismo problema. Está relacionado con el componente TextInput. Incluso un solo TextInput que se representa en una pantalla está causando este error. ¿Existen soluciones alternativas?

react-nativo: 0.55
reaccionar: 16.3.1

rizwanahmed19 en 17 may. 2018

Cambio el constructor ReactEditText "super", parece que no sucede,
pero comenta "underlineColorAndroid"
https://github.com/yuanboGeng/react-native/commit/36f7949f9a3e9c1f3b10df43a9f495f9f8712a1f
react-nativo: 0.53.3
reaccionar: 16.2.0

yuanboGeng en 21 may. 2018

👍1

Esto comenzó a sucederme después de actualizar mi emulador al nivel de API 26 desde el nivel de API 21

dancherb en 25 may. 2018

Tuve este error que apareció sin motivo durante el desarrollo. Limpié mis carpetas / build y ejecuté un run-android nuevamente. El problema desapareció. Muy raro. Espero que para algunos de ustedes una construcción limpia resuelva esto.

mbret en 28 may. 2018

👍2

Tener este mismo problema. Una pequeña diferencia: en la mía, estoy anidando TextInputs dentro de una VirtualizedList (el padre de FlatList) y solo obtengo el problema cuando comienzo a desplazarme en esa lista, incluso entonces solo obteniéndolo de forma intermitente en lugar de todo el tiempo. De manera similar a otros, esto sucede en un entorno de producción, por lo que reiniciar el empaquetador no es una opción.

steveccable en 7 jun. 2018

Según algunas investigaciones, parece estar relacionado con un problema antiguo en el propio Android: https://issuetracker.google.com/issues/37068452
Si ese es el problema subyacente, esto se resolvería simplemente actualizando compileSdk y las versiones de la biblioteca de soporte en el proyecto RN. Sin embargo, no tengo idea del LoE al respecto.

Actualización: intentar forzar a los subproyectos a usar una versión superior de las herramientas de compilación y compileSdk no resolvió este problema para mi proyecto, como se explica en esta publicación SO . No estoy seguro si apliqué mal esas versiones superiores, si mi configuración de compilación no trata a RN como un subproyecto de esa manera, o si en realidad no era una solución válida para el problema aquí.

EDITAR 2: Parece que ReactEditText ni siquiera está usando la versión de la biblioteca de soporte de EditText (que sería AppCompatEditText), lo que explica por qué la actualización de la biblioteca de soporte no hizo nada. Estoy investigando esto: se necesitarán un par de actualizaciones más que solo cambiar la herencia para que esto funcione, pero _podría_ ser la solución correcta para este problema.

EDITAR 3: No fue la solución. Ya no estoy seguro de que este problema sea el mismo que el del AOSP vinculado.
Puedo decir que no parece importar en qué tipo de ScrollView coloque su texto: pude reproducir tanto en VirtualizedList como en ScrollView, y muchos en este hilo lo han hecho con FlatList.

steveccable en 7 jun. 2018

👍5

tengo esto mismo en producción

ahilles107 en 10 jun. 2018

También me enfrento a este problema. Ejecutar cd android ; ./gradlew clean ; cd .. ; react-native run-android funciona para mí como señaló @mbret (¡gracias!)

th317erd en 11 jun. 2018

👎4 👍1

Genial, pero ¿qué pasa con las aplicaciones en producción con clientes reales? : |

ahanusek en 11 jun. 2018

👀1

Lo siento @ahanusek , no estoy diciendo que esto resuelva el problema, solo digo que en el desarrollo esto funcionó para mí (con la esperanza de que también ayude a alguien más).

th317erd en 11 jun. 2018

Pero incluso para el desarrollo no es una solución. Ok, limpias tu compilación, inicias la aplicación de nuevo, pero si usas entradas "apenas", aún podrías obtener este error nuevamente.

ahanusek en 11 jun. 2018

@ahanusek Sí, estoy de acuerdo contigo y de ninguna manera estoy discutiendo contigo. Esta no es una solución, pero para mí, y por ahora, ha funcionado para permitirme seguir desarrollando

th317erd en 11 jun. 2018

También viendo esto, v0.55.4:

screen shot 2018-06-12 at 1 05 41 pm

Estoy bastante seguro de que no tengo un TextField en una FlatList o VirtualizedList, fwiw. Esto está sucediendo en nuestra construcción de producción.

kevboh en 12 jun. 2018

👍3 😕2

Viendo este problema en v0.55.4 . Y sí, estamos usando TextInput en una lista.

2018-06-13_23-04-20_scrot

steverob en 13 jun. 2018

Ocurre en reacción 0.55. Siguiendo

mehulmpt en 17 jun. 2018

👍2

También ocurre en react native 0.55, usando input en flat list.

melkayam92 en 21 jun. 2018

Hacer una publicación real aquí en caso de que la gente no vea mi comentario editado:

Puedo decir que no parece importar en qué tipo de ScrollView coloque su texto: pude reproducir tanto en VirtualizedList como en ScrollView, y muchos en este hilo lo han hecho con FlatList.
O, para expresarlo de otra manera, el problema se reduce 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

steveccable en 21 jun. 2018

Mismo problema

liaoziwei en 23 jun. 2018

También me enfrento al mismo problema.

jchaganti en 23 jun. 2018

Curiosamente, esto no empezó a pasarme hasta anoche y he estado renderizando TextInputs de la misma manera durante más de un mes en desarrollo.

Versión de Android 9
Reaccionar "16.3.1"
React-Native "~ 0.55.2"

Friendly-Robot en 23 jun. 2018

👍1

También nos enfrentamos a un problema similar en nuestro código

Registros de accidentes:
Excepción fatal: java.lang.NullPointerException: intento de invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo
en android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
en android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
en android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
en android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
en android.view.View.computeOpaqueFlags (View.java:16791)
en android.view.View.setBackgroundDrawable (View.java:21710)
en android.view.View.setBackground (View.java:21603)
en android.view.View.(Ver.java:5547)
en android.widget.TextView.(TextView.java:1135)
en android.widget.EditText.(EditText.java:107)
en android.widget.EditText.(EditText.java:103)
en android.widget.EditText.(EditText.java:99)
en android.widget.EditText.(EditText.java:95)
en com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:92)

¿Cuál parece ser el problema aquí?
Probé algunas investigaciones:
- Más de 1000 edittext funcionan en una aplicación pura de Android
- unos 200 ReactTextInput fallan como se identifica aquí

Algunos análisis del problema revelaron un curioso escenario de subprocesos múltiples que se separaba de SparseArray
- SparseArray no es seguro para subprocesos y al mismo tiempo hay lógica de gc () dentro de él
- SparseArray se usa para DrawableContainerState y se puede crear un nuevo DrawableContainerState usando los futuros dibujables de un estado constante existente (esto es SparseArray) mediante la clonación
- Lo anterior es una receta para una excepción de puntero nulo multiproceso y sucede como se muestra a continuación
- El subproceso del módulo nativo que trabaja en la creación del nodo de sombra React Edit Text y su ciclo de vida hace un nuevo EditText (reactthemedcontext) que a su vez da como resultado que se pueda establecer un diseño de fondo y finalmente invocar el código inseguro del subproceso SparseArray
- Mientras tanto, el hilo de la interfaz de usuario podría usarse para crear la pantalla EditText de algún otro RTI al mismo tiempo que conduce al mismo código inseguro del hilo SparseArray
- La excepción de puntero nulo ocurre cuando se invoca gc () y simultáneamente se realiza una clonación (esta clonación ocurre internamente en la clase Drawable *) para el mismo objeto dando lugar a un objeto parcialmente gc-ed. Algo así como un elemento de la matriz de valores se eliminó y anuló, pero el indicador noOfItems aún no se ha actualizado, por lo que el objeto clonado tiene un elemento menos que el especificado en el indicador noOfItems y la iteración puede causar una excepción de puntero nulo para el índice eliminado.

¿Cómo lo solucionamos o lo hicimos funcionar?
[1] Mueva la nueva llamada EditText (contexto) en el hilo de la interfaz de usuario y midió el asíncrono de ShadowNode, pero esperando hasta que este objeto EditText se haya creado en el hilo de la interfaz de usuario; básicamente, reescribió el nodo de sombra setThemedContext y las funciones de medida
Deficiencias: cambio de hilo para cada RTI

[2] Cree EditText usando el inflador de diseño en el módulo nativo mientras especifica nulo para el fondo y cree solo una vez que el fondo se pueda dibujar creando un EditText en el hilo de la interfaz de usuario y almacenando en caché su diseño de fondo en el nivel shadowNode. Este elemento dibujable se usa para establecer el fondo de los dummyEditTexts creados usando el inflador de diseño para obtener la medida, considere los rellenos límite dibujables. En este caso, la medida solo necesita esperar una vez para la creación de Drawable

He probado ambos y funcionan bien para 1024 ReactTextInput.

Nota: Basado en la investigación, esta no parece ser la solución más elegante, pero funciona con cambios mínimos y prueba el análisis del problema.

¡Las sugerencias y críticas son bienvenidas!

Código del nodo de sombra:

`paquete.richtextinput;
importar android.content.Context;
importar android.graphics.drawable.Drawable;
importar android.os.Build;
import android.text.Layout;
importar android.view.LayoutInflater;
importar android.view.ViewGroup;
importar 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 clase no es muy diferente de ReactTextInputShadowNode esperar en el mecanismo de
// establecer el contexto del tema y realizar la medida
La clase pública ReactTextInputShadowNode extiende ReactBaseTextShadowNode implementa YogaMeasureFunction
{
@VisibleForTesting
Cadena final estática pública PROP_TEXT = "texto";
privado estático 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();
}

} `

Archivo de diseño de texto de edición ficticia

<?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" />

Raat-Jaaga-Taara en 25 jun. 2018

👍7 🎉6 👀1

@sayantanbugs , ¿tiene algún código para esta solución? ¡Gracias!

kseniamukhortova en 26 jun. 2018

Actualicé mi último comentario para incluir el código ShadowNode y el diseño utilizado para inflar el texto de edición ficticio

Raat-Jaaga-Taara en 27 jun. 2018

👍5

@sayantanbugs - ¡Ese es un gran trabajo 🕵️! ¡Lo probaremos en nuestro proyecto e informaremos! ¡Gracias!

davidmontemayor en 27 jun. 2018

❤1 😄1

Mismo problema
ReactNative: 0.55.4
Android: 8.0

@sayantanbugs ¿puede proporcionar un parche / parche?

tje3d en 29 jun. 2018

Mismo problema. Informado a través de Crashlytics sin muchos otros detalles, por lo que es 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)

gavin-gmlab en 4 jul. 2018

Esta es la principal causa de que nuestra aplicación se bloquee en producción. ¿Cuándo / cómo puede suceder esto?

RWOverdijk en 4 jul. 2018

😕1

Lo mismo aquí en la construcción de producción.
Ocurre al editar texto. Es aleatorio.

jerdie en 5 jul. 2018

reaccionar: 16.3.0
reaccionar- nativo: 0.54.4
mismo problema, ¿cómo solucionarlo?

yaoyi601131548 en 6 jul. 2018

^^^ Más personas deberían intentar solucionar el problema con la solución @sayantanbugs . Simplemente ubique su archivo ReactTextInputShadowNode.java en su carpeta react-native y cambie el código que proporcionó en su publicación. Puede que se sorprenda gratamente.

Después de una semana desde que lo hice, me complace informarle que el error solo se repitió una vez. PERO esta vez fue diferente ... Pude reiniciar la aplicación y hacer que funcionara normalmente sin necesidad de reinstalar la aplicación a través de react-native run-android cual fue realmente una molestia porque antes literalmente perdería el acceso a un par de pantallas que procesó esos TextInputs. Seguiré tomando nota del error si vuelve a aparecer, pero hasta ahora creo que funciona casi perfectamente en mi extremo. ¡Excelente depuración, @sayantanbugs!

Friendly-Robot en 6 jul. 2018

👍2

@ Friendly-Robot imo no es una solución. En el mejor de los casos, es una solución alternativa. Esto está sucediendo en el código de producción donde no podemos simplemente arreglar una solución no probada que incluso admites que no la arregla.

Si es molesto para el desarrollador, claro, por supuesto. Pero no creo que sea prudente motivar a la gente a usarlo como solución. Quizás como base para un PR.

RWOverdijk en 6 jul. 2018

👍6

De acuerdo con @ Friendly-Robot (no obstante, gracias @sayantanbugs ). ¿Alguien de RN aquí? ¿Crees que el parche puede llegar al repositorio de RN y ser probado?

m-vdb en 6 jul. 2018

Ok, finalmente pude probar el enfoque de @sayantanbugs , pero no pareció funcionar para mí (también se basa en un código no maestro). Sin embargo, como solución temporal (frente a una solución de marco), puede proporcionar su propia copia de ReactEditText con un método drawableStateChanged() parcheado:

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

Esto es literalmente solo un parche, pero al menos la aplicación no se bloqueará. La entrada de texto todavía responde y funciona como se esperaba, por lo que pude ver.

Al reproducir el bloqueo (ahora solucionado), pude ver que esta excepción real sucedió varias veces en rápida sucesión.

EDITAR:
Hmmm ... aunque todo parece funcionar, parece que el estado Drawable se ha corrompido permanentemente. Incluso después de crear una vista completamente nueva con nuevas entradas de texto, tocar cualquier entrada de texto hará que el mensaje vuelva a aparecer. Afortunadamente, solo se muestra al hacer clic en la entrada y no al ingresar texto.

davidmontemayor en 6 jul. 2018

👍2 😄1

He estado jugando con mi vista y transición esta noche, recibí este error como veinte veces ... No estaba haciendo nada más que hacer clic en mis navegaciones para probar las transiciones entre vistas. Supongo que es un gran problema: /

mbret en 7 jul. 2018

¡Gracias @ Friendly-Robot por probar la solución!

Estoy de acuerdo con que la mayoría de las opiniones sobre mi solución son un parche y lo mencioné en mi publicación original que incluye la solución. La razón por la que todavía podría usarse en mi proyecto es porque hemos creado un RTI más rico en funciones de nuestro lado extendiendo el RN RTI. Por lo tanto, podríamos usar mi solución en la implementación de ShadowNode de mi RTI personalizado. De hecho, en nuestro proyecto mantenemos una versión modificada de RN para corregir muchos errores / casos de uso de RN y, por lo tanto, también podemos incorporar estos cambios.

Planeo darle una segunda mirada a otras posibilidades, ya que tuve que resolver el problema candente en cuestión de unos días durante ese tiempo.

¡Gracias a todos por su opinión!

@davidmontemayor , si ese problema de estado de diseño se está notando con mi solución, puede modificar el shadowNode para simplemente hacer un nuevo EditText () siempre pero moviendo esa llamada a UIthread y, por lo tanto, sin manejar el elemento de diseño de ninguna manera. Eso definitivamente lo arreglaría. No quería hacer eso, ya que sería una forma ineficiente de cambiar de hilo cuando el propósito real en el nodo Shadow era simplemente obtener el relleno del borde del fondo, pero el mecanismo empleado por RN no se comporta así, pero tiene un efecto secundario.
Esto nos hace pensar que podríamos estar reescribiendo el ShadowNode nosotros mismos de modo que no necesitemos el objeto EditText de la forma en que se usa en este punto, aparte de usar la función de medida.

Raat-Jaaga-Taara en 7 jul. 2018

A mí también me pasa. Estoy usando ScrollView.
Tengo varios controles (radio, lista, editar texto, etc.) en una vista de desplazamiento. Yo diría que tengo un máximo de 10 controles, por lo que no es una lista enorme.
Sin embargo, es difícil de reproducir. Parece suceder en momentos aleatorios, pero creo que lo estoy rastreando para llevar la aplicación al primer plano desde el fondo cuando tengo ScrollView en la pantalla (con controles de edición de texto).
Aunque no estoy 100% seguro
Me pregunto si está relacionado con la versión lib de soporte de Android.

Vamos FB, arregla este error.
Es difícil crear aplicaciones de calidad de producción cuando tenemos bloqueos aleatorios como este.

com.facebook.react.views.textinput.ReactEditText
Enfermera 0.54
SDK de Android 27
Teléfono 8.1

WilliamAlexander en 12 jul. 2018

Tener este problema también, también usando ScrollViews. @davidmontemayor , ¿podría dirigir su RN newb al archivo que editó por la estructura de directorios? Tengo una aplicación en el mercado a la que el bloqueo está afectando de manera irritante y esperaba detectar el error como lo hizo hasta que se solucione. ¿Tiene un ejemplo del archivo que utilizó?

Squidski en 18 jul. 2018

Mismo:

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

ghost en 18 jul. 2018

@Squidski - Desafortunadamente, la EditText . Como trasfondo, hay _dos_ formas diferentes en que se manifiesta este problema:

Cuando se crea una instancia de ReactEditText ( android.widget.EditText.<init>(EditText.java:95) )
Cuando se interactúa con ReactEditText ( android.widget.TextView.onTouchEvent(TextView.java:8467) )

La clave es reemplazar la vista creada en ReactTextInputShadowNode . En lugar de dejar que haga new EditText(getThemedContext()) , cree su propia clase que se extienda desde EditText . Luego puede detectar la excepción causada por la segunda ruta en drawableStateChanged() .

La parte más difícil es corregir los errores de inicialización. Para eso, necesita crear una clase "Drawable Wrapper" que pueda usarse para envolver cualquier elemento de diseño que se pase a EditText.setBackground() . Este contenedor debería capturar las excepciones lanzadas por el delegado.

davidmontemayor en 24 jul. 2018

Este problema todavía ocurre aleatoriamente con mi aplicación con la última versión de React Native + el último JSC + el último gradle al 25 de julio 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

mehulmpt en 25 jul. 2018

👍2

Empecé a ver este problema con Android 8.0.0 y con RN 0.55.3. ¿Hay alguna solución alternativa para esto o quizás un PR?

jnrepo en 31 jul. 2018

👍1

Tener el mismo problema al azar también con una FlatList de TextInputs 😞

Reaccionar nativo: 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

carloscuesta en 3 ago. 2018

👍4

Basándome en la lectura y la depuración, he decidido probar lo siguiente este fin de semana ...

Eliminar todas las llamadas underlineColorAndroid de mi código (estoy usando react-native-elements 0.19)
- la aplicación debería recurrir al uso de transparente para los controles EditText
- también intenta forzar a transparente
Actualice mis estilos de Android para seguirlos. Esto obligará a todos los controles EditText a tener un fondo 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>

Prueba - Prueba - Prueba. El problema es difícil de reproducir. Aunque un cliente lo encontró esta mañana.
Como alternativa, implemente la corrección de @sayantanbugs
4.1 Actualizar react-native-elements a 1.0xx beta

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

Enfermera 0.54
Reaccionar-elementos-nativos 0.19

WilliamAlexander en 3 ago. 2018

👍3

Ocurre en RN 0.56.0 Android 8.1.0
Me pregunto si hay planes para seguir adelante.

jkadamczyk en 9 ago. 2018

👍2

Intente reemplazar todas las instancias de
underlineColorAndroid={"transparent"}
con
underlineColorAndroid={"#00000000"}

paulroy en 12 ago. 2018

👍6 👎1

Tener este problema. Resuélvelo con algo complicado. Crea un botón que maneje el renderizado de la entrada actual. Entonces tenemos FlatList de botones y solo TextInput que editamos en este momento. Sin referencia, necesitamos hacer doble clic para comenzar a editar la entrada

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)}
        />
    )
}

YanisKondakov en 16 ago. 2018

@WilliamAlexander @paulroy ¿

xstreamcl en 26 ago. 2018

@xstreamcl, la solución que
Sin embargo, necesita más pruebas;)

WilliamAlexander en 26 ago. 2018

Este problema también ha provocado que nuestra aplicación falle en producción. Es un error desagradable, porque es realmente difícil de reproducir. Hemos encontrado una solución prometedora para nuestra aplicación y me gustaría compartir nuestros hallazgos aquí para, con suerte, ahorrarles a otros algo de tiempo y frustración.

Especificaciones y versiones

Este error ha provocado que nuestra aplicación se bloquee en dispositivos Android Samsung, Google y LG. Hemos recibido informes de fallos de las siguientes versiones de Android:

8.0.0
8.1.0
7.1.1

Nuestra aplicación se está ejecutando:

react-native : 0.53.0
react : 16.2.0

Que causa el accidente

Como otros han señalado en este hilo, el problema parece desencadenarse al generar una combinación de componentes TextInput , FlatList y ScrollView . En nuestro caso, tenemos una pantalla que contiene un solo TextInput renderizado sobre un FlatList . Cuando se toca uno de los elementos de FlatList , la aplicación navega a una nueva pantalla que contiene un formulario. El componente raíz de este formulario es ScrollView que contiene varios componentes TextInput (junto con algunos botones y otros componentes personalizados). Nuestra aplicación se bloquea cuando el usuario toca uno de estos FlatList elementos (tenga en cuenta que no sucede _todas_ veces).

Reproducir este problema es difícil. De hecho, no hemos podido hacerlo. Pero sabemos que el bloqueo ocurre en este punto del flujo de trabajo al ver las grabaciones de nuestra sesión de Appsee.

Debido a que no podemos reproducir el problema, hemos tenido que confiar en los registros de fallos de Appsee para depurarlo. Copié el seguimiento de la pila de los informes de fallos a continuación (y omití algunas secciones ruidosas). Es más o menos idéntico a los seguimientos de pila publicados en este hilo por otros:

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)

Fuente del problema

Después de leer este hilo y hacer algunas horas o investigar, encontré el controlador underlineColorAndroid prop en el archivo 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);
  }
}

El informe de error vinculado en el comentario contiene el siguiente seguimiento de pila:

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)

Esto coincide con el seguimiento de la pila que encontramos en nuestra aplicación. No pretendo entender completamente el problema subyacente, pero parece probable que la causa de que nuestra aplicación se bloquee en producción se deba a que se activó el error Drawable.mutate() . Esto sucede cuando intentamos establecer el underlineColorAndroid prop en nuestro componente TextInput (y así invocamos el método ReactTextInputManager.setUnderlineColor ).

Nuestra aplicación mostraba un TextInput con los siguientes accesorios, uno de los cuales 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 lo arreglamos

Necesitábamos configurar este accesorio para eliminar el subrayado de los componentes TextInput en nuestra aplicación. Pero según nuestros hallazgos, su controlador de accesorios parecía estar desencadenando un error de Android que causaba que la aplicación se bloqueara ocasionalmente.

Afortunadamente, hay otra forma de eliminar los subrayados de los componentes TextInput en Android. Puede agregar una línea al archivo 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>

Tenga en cuenta que también he visto lo siguiente sugerido, pero esto no eliminó los subrayados para nosotros:

<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>

Esto no resuelve el problema subyacente. Es solo una solución alternativa que implica evitar el uso de underlineColorAndroid prop en los componentes TextInput .

Todavía no puedo decir con certeza que esto realmente funcione, porque no he podido reproducir el problema localmente. Implementaremos este cambio en una actualización de nuestra aplicación en las próximas semanas. Después de eso, tendremos que esperar un poco para ver si ocurre más. Intentaré informarle con nuestros hallazgos.

¡Buena suerte a todos los que luchan con este frustrante problema! Espero que esto ayude.

Hopding en 27 ago. 2018

👍91 ❤38 🎉29 😄18

¡Gracias @Hopding aparentemente su solución está funcionando!

sturmenta en 28 ago. 2018

@Hopding
Sí trabajando muchas gracias

jariwalabhavesh en 29 ago. 2018

Para nosotros, este problema y todos los problemas similares en los que encuentras un método de llamada en una referencia nula en Android se deben a que no tienes

La cuestión es que la mayoría de los componentes react-native , si no todos, se extienden desde los componentes appcompat ; es decir Por lo tanto, tener un estilo como este es obligatorio:

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

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

Esto sucede porque el componente appcopmat no se representa en primer lugar y, por lo tanto, view.getDrawable() devuelve un valor nulo desde el cual no puede llamar a ningún método como: setUnderlineColor o setColorTint (Los interruptores también tienen este problema).

En nuestro caso, debido a que estábamos usando react-native para crear bibliotecas nativas que luego se instalan en aplicaciones nativas, no podemos controlar que los estilos estén presentes en la aplicación final. Aunque, al menos ahora somos conscientes de ese problema y mejoramos nuestra documentación;)

¡Espero eso ayude!

sospedra en 29 ago. 2018

🎉2 👍2

@sospedra Tu comentario tiene sentido, pero revisé mi código y descubrí que appcompat ya existe en mi estilo. Si revisa la solución alternativa de Hopding, también tiene appcompat ya.

xufeipyxis en 31 ago. 2018

@Hopding
Este estilo funciona bien:

WilliamAlexander en 4 sept. 2018

@WilliamAlexander , no pude hacer que tu sugerencia funcionara. ¿Puedes incluir todo el estilo que te funcione?
El otro problema al que me enfrento es que al aplicar la solución de varias líneas de modo que el teclado cubre la entrada de texto parcialmente ahora. Arrancarme el pelo tratando de solucionar este problema aparentemente simple

Actualización: el estilo de @Hopding debe escribirse de esta manera

    <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>

Tuve que agregar el relleno para arreglar la rotura del diseño.

gavin-gmlab en 14 sept. 2018

@ gavin-gmlab.

Aquí 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>

'

WilliamAlexander en 15 sept. 2018

👍3

Se eliminó underlineColorAndroid = "transparent"

y cambiado style.xml

esta trabajando para mi

rajscet en 27 oct. 2018

ninguna de las soluciones anteriores funcionó para mí, pero aparentemente cerrar la aplicación más el empaquetador y volver a ejecutar lo hizo.

samermurad en 12 nov. 2018

👍1

Simplemente borre los datos de su aplicación y vuelva a ejecutarla

kuldeepoza14 en 13 nov. 2018

👎23 👍3 🎉2 🚀1

Gracias @WilliamAlexander y @Hopding por su solución, pero cuando cambio el fondo, también elimina el relleno de InputText. En lugar de eso, usé backgroundTint y funciona bien sin ningún cambio en el relleno

`` ``

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

`` ``

SiSa68 en 3 dic. 2018

👍5 🎉3 🚀2

Ok, ¿hay alguna solución para esto para los usuarios de la Expo excepto la expulsión?

Twishka en 9 ene. 2019

@Twishka Desafortunadamente, también tendrías que expulsar a raw react-native, porque Expokit tiene los mismos problemas.

ChrisKG32 en 10 ene. 2019

Ni siquiera estoy configurando underlineColorAndroid en ninguna parte de mi aplicación, todavía tengo este registro en mi consola de base de fuego. Y no tengo idea de cómo reproducir este problema nuevamente.

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)

Hablando de colores, tengo placeHolderTextColor y borderColor en #acacac y cuando ocurre algún problema de validación, borderColor en red . Aparte de eso, ni siquiera estoy configurando underlineColorAndroid .

Se agradece cualquier ayuda.

mddanishansari en 11 ene. 2019

😄1

@mddanishansari Dado que rn 0.56 underlineColorAndroid está configurado de forma predeterminada , necesita la corrección mencionada anteriormente.

sunnylqm en 11 ene. 2019

👍2

@mddanishansari Dado que rn 0.56 underlineColorAndroid está configurado de forma predeterminada , necesita la corrección mencionada anteriormente.

Muchas gracias. No esperaba una respuesta tan rápida. El problema es que todos los demás fondos nativos originales EditText también son transparentes, lo que parece extraño. Algunas pantallas de mi aplicación también están en formato nativo original (Java).

Me preguntaba cómo se puede resolver este problema. La solución proporcionada es un simple truco. ¿Correcto?

mddanishansari en 11 ene. 2019

Hola chicos. Entonces, usar underlineColorAndroid desencadena este bloqueo de alguna manera.
Pero ahora, además, underlineColorAndroid está configurado por defecto.
¿Cómo puedo evitar usar esto y volver a styles.xml.?

Saludos

finalquest en 29 ene. 2019

En caso de que esto ayude a alguien. En mi caso, accidentalmente estaba enviando NaN en lugar del valor de color real que me sucedió en 'borderBottomLeftRadius'. No tuve ningún problema con el Iphone, solo Android.

nicoboy11 en 30 ene. 2019

las soluciones de este hilo no me funcionan. Incluso cuando establezco underlineColorAndroid para todas mis entradas de texto en algo no transparente (probé con '#f00' ), sigo experimentando este problema.

Para mí, el problema no ocurre de manera constante. Tengo un montón de TextInputs dentro de un ScrollView, y tengo que abrir y cerrar la pantalla varias veces para que ocurra

kufii en 7 feb. 2019

👍2

No es la transparencia lo que causa el error, es el cambio de
color nativo del apoyo nativo de reacción. Es solo que casi todos
hace que el subrayado nativo sea transparente con el accesorio.

El miércoles 6 de febrero de 2019 a las 10:23 p.m., Adrien Pyke [email protected] escribió:

las soluciones de este hilo no me funcionan. Incluso al configurar el
underlineColorAndroid para todos mis mensajes de texto a algo no transparente
(Probé con '# f00'), todavía tengo este problema.
Para mí, el problema no ocurre de manera constante. Tengo un montón de TextInputs
dentro de un ScrollView, y tengo que abrir y cerrar la pantalla varias veces
para que ocurra
-
Estás recibiendo esto porque comentaste.
Responda a este correo electrónico directamente, véalo en GitHub
https://github.com/facebook/react-native/issues/17530#issuecomment-461283498 ,
o silenciar el hilo
https://github.com/notifications/unsubscribe-auth/AOG_BAlfs-GKED4gOuvtKlMD0vwEH-_zks5vK6ozgaJpZM4RaUHf
.

ChrisKG32 en 7 feb. 2019

👍1

OK veo.

Solo por curiosidad, intenté eliminar el valor predeterminado de transparente de aquí

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

Curiosamente, el error todavía me ocurre

kufii en 7 feb. 2019

Acabo de experimentar este error en Android RN 58.3. No había ninguna rima o razón aparente, excepto que cada vez que renderizaba un componente TextInput , el error aparecía. Incluso si renderizara un TextInput sin accesorios ni alteraciones, aún se bloquearía.

Intenté reiniciar Metro y restablecer el caché, pero no funcionó. De hecho, tuve que abrir Android Studio y reconstruir la aplicación, momento en el que comenzó a funcionar. ¿Podría esto ser un problema con gradle que no agrupa las dependencias correctamente o algo así? Parece una posibilidad remota ya que estuve desarrollando durante unas buenas 4 horas sin reiniciar nada antes de experimentar este problema, pero realmente no puedo pensar en qué más podría causarlo.

rmilejcz en 20 feb. 2019

👍1

Experimenté este error en RN 58.0 en dispositivos:
Redmi Note 6 Pro - Android 8.1
Mi A2 Lite - Android 9
WAS-LX1A - Android 8

Aparece a veces mirando en Sentry, espero que ayude.

iagormoraes en 22 feb. 2019

👍2

¿Los desarrolladores solucionarán este problema? ¡La solución alternativa no es adecuada para nosotros!

dimlksin2 en 12 mar. 2019

👍2

tengo esto mismo en producción

tamdao en 15 mar. 2019

Tenemos el mismo seguimiento de pila que los dos informados anteriormente, en React 0.59

(con DrawableContainerState.createAllFutures en la segunda línea del seguimiento de la pila)

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)

kassim en 21 mar. 2019

👍8

Acabo de obtener el mismo seguimiento de pila que el anterior después de actualizar la versión de producción de 0.58.6 a 0.59.1 hace solo unas horas. Me temo que resultará ser un problema grave.

JanErikFoss en 22 mar. 2019

¿Alguna solución para este problema?

tamdao en 28 mar. 2019

@sunnylqm ¿hay alguna manera de establecer underlineColorAndroid en nulo, ya que está configurado de forma predeterminada?

pedrosimao en 28 mar. 2019

@pedrosimao @tamdao
Debe eliminar manualmente esta línea a través de alguna herramienta de parche como configuración xml .
Entonces, el punto clave es not set any value to underlineColorAndroid anywhere hasta que algún héroe encuentre una manera de parchear esto.

sunnylqm en 28 mar. 2019

👍2 🎉1

Recibí este error hoy
Funciona bien antes, pero después de algunas compilaciones, se produjo un error en mi dispositivo.
La solución para este problema para mí es desinstalar la aplicación en el dispositivo y luego reinstalar la aplicación a través de react-native run-android
Después de eso, el problema se ha ido

Por cierto, no uso los accesorios underlineColorAndroid, por lo que no funciona lo que sea que establezca o desarme ningún valor para esos accesorios

KononK-Fox en 30 mar. 2019

👍1

Esto sucede aleatoriamente cuando usas algunas entradas de texto dentro de una vista de desplazamiento. underlineColorAndroid siempre se usa porque está configurado por defecto .

sunnylqm en 30 mar. 2019

👍2

A mí también me pasó hoy, en la Expo.

Si está en la Expo, deberá cerrar el servidor de la exposición, su aplicación y la aplicación de la Expo por completo. Y vuelva a abrirlos.

De lo contrario, el error no desaparecería.

MIKI0N en 2 abr. 2019

👍7 ❤3

Me pasó a mí, en la Expo.

Por alguna razón, hubo dos instancias de mi aplicación en segundo plano. Cuando hice clic en el botón cuadrado de Android, llamado "Descripción general", para ver las aplicaciones en la memoria, vi estas dos instancias de mi aplicación ... cuando las cerré y ejecuté la aplicación nuevamente, ya no mostraba este error.

Entonces, como dijeron los chicos anteriormente, cierre todo y vuelva a ejecutar, debería solucionarlo

carlosfilipe en 10 abr. 2019

👍2

Pasé 3 horas tratando de resolver este error sin resultados, luego reinstalé mi aplicación en mi emulador de Android y el error desapareció.

Auggysg en 11 abr. 2019

👍2

Pruebe 0.59.4 para ver si todavía encuentra este bloqueo.

@sunnylqm Todavía

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)

wbercx en 22 abr. 2019

👍4

Tengo este error con un componente que procesa varios TextInputs,
Cuando reinicio la compilación o la aplicación, se va y vuelve cuando vuelvo a renderizar por segunda vez.

Android: 9
Teléfono: SAMSUNG Galaxy note 9
Modelo: SM-N960F / DS
versión de react-native "0.58.5"

Intenta invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo
createAllFutures
DrawableContainer. java: 875
getOpacity
DrawableContainer. java: 1158
getOpacity
DrawableContainer. java: 433
getOpacity
InsetDrawable. java: 258
computeOpaqueFlags
Ver. java: 18165
setBackgroundDrawable
Ver. java: 23335
Definir fondo
Ver. java: 23228

Ver. java: 5952

Vista de texto. java: 1108

Editar texto. java: 106

Editar texto. java: 102

Editar texto. java: 98

Editar texto. Java: 94
setThemedContext
ReactTextInputShadowNode. java: 73
createView
Implementación de UII. java: 288
createView
UIManagerModule. Java: 449
invocar
Method.java
invocar
JavaMethodWrapper. Java: 372
invocar
JavaModuleWrapper. Java: 158
correr
NativeRunnable.java
handleCallback
Manipulador. java: 873
dispatchMessage
Manipulador. java: 99
dispatchMessage
MessageQueueThreadHandler. java: 29
lazo
Looper. java: 214
correr
MessageQueueThreadImpl. java: 192
correr
Hilo. java: 764

6youss en 24 abr. 2019

👍1

También tengo el mismo problema en Samsung Note 8, Android versión 9 y React native 0.57.0

LuongTruong en 27 abr. 2019

👍1

El mismo problema aquí. Reaccionar nativo 0.59.0. El problema aparece al azar cuando se usa la aplicación. No se pudo ver ningún patrón para que apareciera. Ocurre tanto en modo de desarrollo como en producción.

ThomasFindlay en 29 abr. 2019

Este problema también ha provocado que nuestra aplicación falle en producción. Es un error desagradable, porque es realmente difícil de reproducir. Hemos encontrado una solución prometedora para nuestra aplicación y me gustaría compartir nuestros hallazgos aquí para, con suerte, ahorrarles a otros algo de tiempo y frustración.
Especificaciones y versiones
Este error ha provocado que nuestra aplicación se bloquee en dispositivos Android Samsung, Google y LG. Hemos recibido informes de fallos de las siguientes versiones de Android:
8.0.0
8.1.0
7.1.1
Nuestra aplicación se está ejecutando:
react-native : 0.53.0
react : 16.2.0
Que causa el accidente
Como otros han señalado en este hilo, el problema parece desencadenarse al generar una combinación de componentes TextInput , FlatList y ScrollView . En nuestro caso, tenemos una pantalla que contiene un solo TextInput renderizado sobre un FlatList . Cuando se toca uno de los elementos de FlatList , la aplicación navega a una nueva pantalla que contiene un formulario. El componente raíz de este formulario es ScrollView que contiene varios componentes TextInput (junto con algunos botones y otros componentes personalizados). Nuestra aplicación se bloquea cuando el usuario toca uno de estos FlatList elementos (tenga en cuenta que no sucede _todas_ veces).
Reproducir este problema es difícil. De hecho, no hemos podido hacerlo. Pero sabemos que el bloqueo ocurre en este punto del flujo de trabajo al ver las grabaciones de nuestra sesión de Appsee.
Debido a que no podemos reproducir el problema, hemos tenido que confiar en los registros de fallos de Appsee para depurarlo. Copié el seguimiento de la pila de los informes de fallos a continuación (y omití algunas secciones ruidosas). Es más o menos idéntico a los seguimientos de pila publicados en este hilo por otros:
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)
Fuente del problema
Después de leer este hilo y hacer unas horas o investigar, encontré el controlador underlineColorAndroid prop en el archivo 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);
  }
}
El informe de error vinculado en el comentario contiene el siguiente seguimiento de pila:
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)
Esto coincide con el seguimiento de la pila que encontramos en nuestra aplicación. No pretendo comprender completamente el problema subyacente, pero parece probable que la causa de la falla de nuestra aplicación en producción se deba a que se ha activado el error Drawable.mutate() . Esto sucede cuando intentamos establecer el underlineColorAndroid prop en nuestro componente TextInput (y así invocamos el método ReactTextInputManager.setUnderlineColor ).
Nuestra aplicación mostraba un TextInput con los siguientes accesorios, uno de los cuales 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 lo arreglamos
Necesitábamos configurar este accesorio para eliminar el subrayado de los componentes TextInput en nuestra aplicación. Pero según nuestros hallazgos, su controlador de accesorios parecía estar desencadenando un error de Android que causaba que la aplicación se bloqueara ocasionalmente.
Afortunadamente, hay otra forma de eliminar los subrayados de los componentes TextInput en Android. Puede agregar una línea al archivo android/app/src/main/res/values/styles.xml :
<resources>
    
    <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>
Tenga en cuenta que también he visto lo siguiente sugerido, pero esto no eliminó los subrayados para nosotros:
<resources>
    
    <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>

+   
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="72">@android</strong>:color/transparent</item>
+   </style>
</resources>
Esto no resuelve el problema subyacente. Es solo una solución alternativa que implica evitar el uso de underlineColorAndroid prop en los componentes TextInput .
Todavía no puedo decir con certeza que esto realmente funcione, porque no he podido reproducir el problema localmente. Implementaremos este cambio en una actualización de nuestra aplicación en las próximas semanas. Después de eso, tendremos que esperar un poco para ver si ocurre más. Intentaré informarle con nuestros hallazgos.
¡Buena suerte a todos los que luchan con este frustrante problema! Espero que esto ayude.

Sé cómo reproducir esta situación. Haga clic de nuevo en el formulario como dijo, y luego haga clic en el elemento de la lista plana para ingresar al formulario. Repita unas diez veces, y un poco más rápido, se producirá este error. Puedes reproducir el error de acuerdo a lo que dije.

wangjianhuiwita en 30 abr. 2019

👍4

@Hopding
Sé cómo reproducir esta situación. Haga clic de nuevo en el formulario como dijo, y luego haga clic en el elemento de la lista plana para ingresar al formulario. Repita unas diez veces, y un poco más rápido, se producirá este error. Puedes reproducir el error de acuerdo a lo que dije.

wangjianhuiwita en 30 abr. 2019

👍4 😄3 🎉2 👀1

@Hopding
He eliminado underlineColorAndroid, pero lo reproduciré.

wangjianhuiwita en 30 abr. 2019

👍3 🎉1

@ react-native-bot este problema es muy importante

wangjianhuiwita en 5 may. 2019

👍7

Estoy usando RN 59.5 y también tengo este problema.

Intenta invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo
createAllFutures
DrawableContainer. java: 875
getOpacity
DrawableContainer. java: 1158
getOpacity
DrawableContainer. java: 433
getOpacity
InsetDrawable. java: 258
computeOpaqueFlags
Ver. java: 16594
setBackgroundDrawable
Ver. java: 21577
Definir fondo
Ver. java: 21470

Ver. java: 5498

Vista de texto. java: 875

Editar texto. java: 88

Editar texto. java: 84

Editar texto. java: 80

Editar texto. java: 76
setThemedContext
ReactTextInputShadowNode. java: 76
createView
Implementación de UII. java: 294
createView
UIManagerModule. java: 462
invocar
Method.java
invocar
JavaMethodWrapper. Java: 372
invocar
JavaModuleWrapper. Java: 158
correr
NativeRunnable.java
handleCallback
Manipulador. java: 873
dispatchMessage
Manipulador. java: 99
dispatchMessage
MessageQueueThreadHandler. java: 29
lazo
Looper. java: 193
correr
MessageQueueThreadImpl. java: 232
correr
Hilo. java: 764

mydesweb en 5 may. 2019

¿Alguien ya resolvió esto? Estoy con este problema en RN 52, actualicé a 56 pero aún aparece el error. Probé los pasos para reproducirlo, pero no puedo. Algunos dispositivos siguen disparando esto al azar.

agrass en 13 may. 2019

suerte con este problema?

tamdao en 14 may. 2019

👍2

me sale este problema RN 0.59.5

nugrohotanjo en 17 may. 2019

Este problema también ha provocado que nuestra aplicación falle en producción. Es un error desagradable, porque es realmente difícil de reproducir. Hemos encontrado una solución prometedora para nuestra aplicación y me gustaría compartir nuestros hallazgos aquí para, con suerte, ahorrarles a otros algo de tiempo y frustración.
Especificaciones y versiones
Este error ha provocado que nuestra aplicación se bloquee en dispositivos Android Samsung, Google y LG. Hemos recibido informes de fallos de las siguientes versiones de Android:
8.0.0
8.1.0
7.1.1
Nuestra aplicación se está ejecutando:
react-native : 0.53.0
react : 16.2.0
Que causa el accidente
Como otros han señalado en este hilo, el problema parece desencadenarse al generar una combinación de componentes TextInput , FlatList y ScrollView . En nuestro caso, tenemos una pantalla que contiene un solo TextInput renderizado sobre un FlatList . Cuando se toca uno de los elementos de FlatList , la aplicación navega a una nueva pantalla que contiene un formulario. El componente raíz de este formulario es ScrollView que contiene varios componentes TextInput (junto con algunos botones y otros componentes personalizados). Nuestra aplicación se bloquea cuando el usuario toca uno de estos FlatList elementos (tenga en cuenta que no sucede _todas_ veces).
Reproducir este problema es difícil. De hecho, no hemos podido hacerlo. Pero sabemos que el bloqueo ocurre en este punto del flujo de trabajo al ver las grabaciones de nuestra sesión de Appsee.
Debido a que no podemos reproducir el problema, hemos tenido que confiar en los registros de fallos de Appsee para depurarlo. Copié el seguimiento de la pila de los informes de fallos a continuación (y omití algunas secciones ruidosas). Es más o menos idéntico a los seguimientos de pila publicados en este hilo por otros:
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)
Fuente del problema
Después de leer este hilo y hacer unas horas o investigar, encontré el controlador underlineColorAndroid prop en el archivo 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);
  }
}
El informe de error vinculado en el comentario contiene el siguiente seguimiento de pila:
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)
Esto coincide con el seguimiento de la pila que encontramos en nuestra aplicación. No pretendo comprender completamente el problema subyacente, pero parece probable que la causa de la falla de nuestra aplicación en producción se deba a que se ha activado el error Drawable.mutate() . Esto sucede cuando intentamos establecer el underlineColorAndroid prop en nuestro componente TextInput (y así invocamos el método ReactTextInputManager.setUnderlineColor ).
Nuestra aplicación mostraba un TextInput con los siguientes accesorios, uno de los cuales 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 lo arreglamos
Necesitábamos configurar este accesorio para eliminar el subrayado de los componentes TextInput en nuestra aplicación. Pero según nuestros hallazgos, su controlador de accesorios parecía estar desencadenando un error de Android que causaba que la aplicación se bloqueara ocasionalmente.
Afortunadamente, hay otra forma de eliminar los subrayados de los componentes TextInput en Android. Puede agregar una línea al archivo android/app/src/main/res/values/styles.xml :
<resources>
    
    <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>
Tenga en cuenta que también he visto lo siguiente sugerido, pero esto no eliminó los subrayados para nosotros:
<resources>
    
    <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>

+   
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="73">@android</strong>:color/transparent</item>
+   </style>
</resources>
Esto no resuelve el problema subyacente. Es solo una solución alternativa que implica evitar el uso de underlineColorAndroid prop en los componentes TextInput .
Todavía no puedo decir con certeza que esto realmente funcione, porque no he podido reproducir el problema localmente. Implementaremos este cambio en una actualización de nuestra aplicación en las próximas semanas. Después de eso, tendremos que esperar un poco para ver si ocurre más. Intentaré informarle con nuestros hallazgos.
¡Buena suerte a todos los que luchan con este frustrante problema! Espero que esto ayude.
Sé cómo reproducir esta situación. Haga clic de nuevo en el formulario como dijo, y luego haga clic en el elemento de la lista plana para ingresar al formulario. Repita unas diez veces, y un poco más rápido, se producirá este error. Puedes reproducir el error de acuerdo a lo que dije.

Parece que esto lo soluciona.

cristianoccazinsp en 17 may. 2019

👍5

Para aquellos que se preguntan cómo reproducirlo: lo reproducimos agregando 100 <TextInput ...> s a <ScrollView ...> . En ese momento, pudimos reproducir el error con una tasa de éxito estimada del 75% al 90%. Suficiente para probar soluciones. 50 campos no fueron suficientes.

La solución de @Hopding funcionó para nosotros. La solución alternativa de "tinte" propuesta (por otros) no funciona. El desafortunado efecto secundario de la solución es que se elimina el relleno de las entradas de texto.

scarlac en 23 may. 2019

Igual que aquí.

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

mrkacan en 1 jun. 2019

alguna solución?

knspatel en 3 jun. 2019

👍1

Aquí hay un código donde se reproduce el error 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,
>   }
> });
>

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

Solución por favor.

Maxteel-GitHub en 5 jun. 2019

Este problema se abrió el 11 de enero de 2018 y ahora es mayo de 2019, ¿por qué nadie del equipo oficial lo está abordando?
FYI, las soluciones alternativas no están funcionando.

vishalenrique en 7 jun. 2019

👍8

Lo mismo aquí 0.59.6

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

bug_react

lucastryhorn en 7 jun. 2019

@knspatel Nuestra solución fue superponer la pantalla con un modal que

Friendly-Robot en 9 jun. 2019

Déjame recapitular:
El punto clave es no establecer ningún valor para underlineColorAndroid en ningún lugar . Pero dado que 0.57 underlineColorAndroid está configurado de forma predeterminada , debe eliminar manualmente esta línea a través de alguna herramienta de parche como
Y si aún desea que el subrayado sea invisible, debe configurarlo en alguna configuración xml .

Y aquí hay información que encontré hasta ahora:
Un blog chino (puede probar el traductor de Google si no puede leer) mencionó un problema muy similar a este. Dijo que alguna clase de diseño personalizado sin la implementación de getConstantState puede causar un bloqueo en algún escenario.

Descubrí que a veces la entrada de texto (ReactEditText) se volverá a crear (más entradas de texto, más posibilidades, ¿tipo de reciclaje?), Y volverá a setBackground , que luego irá a https://github.com/aosp-mirror/ platform_frameworks_base / blob / master / graphics / java / android / graphics / drawable / DrawableContainer.java # L922 , donde ConstantState es nulo.

La única clase dibujable personalizada que encontré es getConstantState que devolverá nulo por defecto.
Traté de anularlo con alguna clase vacía y puede hacer alguna diferencia (este bloqueo desaparece mientras surgen otros).

Espero que esto pueda ayudar a alguien a profundizar más.

sunnylqm en 11 jun. 2019

👍10

Descubrí que las pruebas manuales eran muy impredecibles, así que escribí un componente para probar automáticamente algunos de los escenarios que la gente ha estado informando anteriormente. Encontrará el componente a continuación. Solo tiene que renderizarlo en algún lugar para que haga su trabajo.

Al hacer esto, descubrí que solo necesita agregar lo siguiente al AppTheme en styles.xml como lo sugiere @Hopding
<item name="android:editTextBackground"><strong i="7">@android</strong>:color/transparent</item>

No se requería nada más, y _no era necesario_ evitar configurar underlineColorAndroid , por lo que no importaba que React Native ahora lo configurara de forma predeterminada.

La principal desventaja de esta solución es que debe cambiar el estilo de sus TextInputs para permitir la pérdida resultante de relleno, y también pierde el comportamiento real de subrayado, lo que para nosotros fue un beneficio, ya que siempre lo configuramos como "transparente". para ser coherente con iOS. Si lo necesita, puede crear un componente de envoltura que observe onFocus y onBlur y haga su propio subrayado.

Mi versión de React Native es 0.57.3

Aquí hay algunas otras cosas que encontré usando mi componente de prueba:

No pude causar el bloqueo en absoluto en mi dispositivo de tableta Android de baja especificación. Sin embargo, fue bastante fácil de reproducir en mi teléfono Samsung S6 Edge con Android 7. Supongo que hay una condición de carrera que necesita un dispositivo más rápido para provocarla.
Desplazar las entradas de texto no hizo ninguna diferencia, y pude reproducir fácilmente el problema sin siquiera usar un ScrollView.
No era necesario ingresar texto. Simplemente cambiar el enfoque fue suficiente para provocar el accidente.
No importaba el color en el que estableciera el subrayado, incluso undefined causó el bloqueo, pero tal vez esperaría eso, dado que RN ahora lo establece de forma predeterminada en "transparente"
Tener un buen número de TextInputs mostrando a la vez marcó la diferencia, ya que el bloqueo ocurrió más rápido con 100 que solo con 10 en la pantalla.
No pude reproducir el bloqueo con displayForMs: 0 lo que sugiere que solo ocurre cuando los TextInputs se han creado recientemente.

Si no quiere quedarse mientras prueba, puede capturar la salida de adb logcat y buscar los mensajes de consola producidos por el componente y el informe de fallas.

Aquí está mi componente de prueba en caso de que desee utilizarlo. Los parámetros de prueba están configurados para causar un bloqueo en menos de 30 segundos para mí.

/**
 * 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;

glenn-axsy en 20 jun. 2019

👍37 🎉14 ❤13 🚀11 😄7

Para todos aquellos que buscan una solución, también puedo confirmar esa configuración@android : color / transparente en styles.xml solucionó el problema.

ThomasFindlay en 22 jun. 2019

FYI: Estamos usando React-Native Paper y su componente TextInput y pudimos configurar de forma segura <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> sin ningún efecto en RN-Paper TextInput y no hemos experimentado el bloqueo desde entonces.

creambyemute en 24 jun. 2019

Viendo en producción en 0.59.9 .

Crashlytics:

Samsung Galaxy S7 borde
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)

suvodeep-pyne en 28 jun. 2019

👍3

Cambiando esto:

state = {
  data: []
}

a esto:

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

solucionó el problema para mí. ¿No estoy seguro de por qué, porque establecer el estado como variable de clase debería estar bien? ¿Nadie?

wbodron en 28 jun. 2019

@wbodron No, eso no está relacionado. El bloqueo es aleatorio, por lo que puede pensar que se ha ido pero en realidad no. Y el punto clave que he explicado anteriormente https://github.com/facebook/react-native/issues/17530#issuecomment -500865260

sunnylqm en 29 jun. 2019

cc @cpojer @shergin @sahrens

ecreeth en 1 jul. 2019

Elimina la carpeta de compilación de Android.
Your_Project> android> aplicación> compilación

Después de eliminarlo, ejecute react-native run-android

debería funcionar bien.
Trabajó para mí: D

upasanadeka en 3 jul. 2019

👎11 👍4 🎉1

Ya probé esto y eliminé underlineColorAndroid pero sigo con el problema. ¿Alguien con otra solución?

Este problema también ha provocado que nuestra aplicación falle en producción. Es un error desagradable, porque es realmente difícil de reproducir. Hemos encontrado una solución prometedora para nuestra aplicación y me gustaría compartir nuestros hallazgos aquí para, con suerte, ahorrarles a otros algo de tiempo y frustración.
Especificaciones y versiones
Este error ha provocado que nuestra aplicación se bloquee en dispositivos Android Samsung, Google y LG. Hemos recibido informes de fallos de las siguientes versiones de Android:
8.0.0
8.1.0
7.1.1
Nuestra aplicación se está ejecutando:
react-native : 0.53.0
react : 16.2.0
Que causa el accidente
Como otros han señalado en este hilo, el problema parece desencadenarse al generar una combinación de componentes TextInput , FlatList y ScrollView . En nuestro caso, tenemos una pantalla que contiene un solo TextInput renderizado sobre un FlatList . Cuando se toca uno de los elementos de FlatList , la aplicación navega a una nueva pantalla que contiene un formulario. El componente raíz de este formulario es ScrollView que contiene varios componentes TextInput (junto con algunos botones y otros componentes personalizados). Nuestra aplicación se bloquea cuando el usuario toca uno de estos FlatList elementos (tenga en cuenta que no sucede _todas_ veces).
Reproducir este problema es difícil. De hecho, no hemos podido hacerlo. Pero sabemos que el bloqueo ocurre en este punto del flujo de trabajo al ver las grabaciones de nuestra sesión de Appsee.
Debido a que no podemos reproducir el problema, hemos tenido que confiar en los registros de fallos de Appsee para depurarlo. Copié el seguimiento de la pila de los informes de fallos a continuación (y omití algunas secciones ruidosas). Es más o menos idéntico a los seguimientos de pila publicados en este hilo por otros:
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)
Fuente del problema
Después de leer este hilo y hacer unas horas o investigar, encontré el controlador underlineColorAndroid prop en el archivo 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);
  }
}
El informe de error vinculado en el comentario contiene el siguiente seguimiento de pila:
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)
Esto coincide con el seguimiento de la pila que encontramos en nuestra aplicación. No pretendo comprender completamente el problema subyacente, pero parece probable que la causa de la falla de nuestra aplicación en producción se deba a que se ha activado el error Drawable.mutate() . Esto sucede cuando intentamos establecer el underlineColorAndroid prop en nuestro componente TextInput (y así invocamos el método ReactTextInputManager.setUnderlineColor ).
Nuestra aplicación mostraba un TextInput con los siguientes accesorios, uno de los cuales 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 lo arreglamos
Necesitábamos configurar este accesorio para eliminar el subrayado de los componentes TextInput en nuestra aplicación. Pero según nuestros hallazgos, su controlador de accesorios parecía estar desencadenando un error de Android que causaba que la aplicación se bloqueara ocasionalmente.
Afortunadamente, hay otra forma de eliminar los subrayados de los componentes TextInput en Android. Puede agregar una línea al archivo android/app/src/main/res/values/styles.xml :
<resources>
    
    <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>
Tenga en cuenta que también he visto lo siguiente sugerido, pero esto no eliminó los subrayados para nosotros:
<resources>
    
    <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>

+   
+   <style name="AppEditTextStyle" parent="@style/Widget.AppCompat.EditText">
+     <item name="android:background"><strong i="74">@android</strong>:color/transparent</item>
+   </style>
</resources>
Esto no resuelve el problema subyacente. Es solo una solución alternativa que implica evitar el uso de underlineColorAndroid prop en los componentes TextInput .
Todavía no puedo decir con certeza que esto realmente funcione, porque no he podido reproducir el problema localmente. Implementaremos este cambio en una actualización de nuestra aplicación en las próximas semanas. Después de eso, tendremos que esperar un poco para ver si ocurre más. Intentaré informarle con nuestros hallazgos.
¡Buena suerte a todos los que luchan con este frustrante problema! Espero que esto ayude.
Sé cómo reproducir esta situación. Haga clic de nuevo en el formulario como dijo, y luego haga clic en el elemento de la lista plana para ingresar al formulario. Repita unas diez veces, y un poco más rápido, se producirá este error. Puedes reproducir el error de acuerdo a lo que dije.

agrass en 3 jul. 2019

❤4 😄2

¿que puedo hacer? ¡Yo también estoy enfrentando este problema!

AppleMango23 en 4 jul. 2019

igual que aquí. Afrontarlo en producción

jake41 en 6 jul. 2019

@ jake41 Intenté reiniciarlo y funcionó, ¿ha intentado reiniciarlo? Me enfrento a este problema después de actualizar mi expo cli, creo que es el problema de la versión.

AppleMango23 en 7 jul. 2019

@agrass Probaré tu método. Parece prometedor.
Pero mi aplicación se bloquea muy raramente por esta causa. ¿Este problema hace que la aplicación se bloquee cada vez? ¿o algunas veces?
El DAU de nuestra aplicación es de alrededor de 8k, y esto ocurre aproximadamente una vez al día. Por lo tanto, es insignificante, pero espero curar el accidente.

JJMoon en 9 jul. 2019

¿Alguien encontró una solución adecuada para ello? Ocurre muy raramente y solo en el componente donde hay un campo de texto.

satyavamsi en 11 jul. 2019

El problema aún persiste con React Native 0.60

artus9033 en 12 jul. 2019

👍32

Reaccionar nativo: 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)

artshevtsov en 17 jul. 2019

Tengo el mismo problema aquí
Enfermera registrada: 0.59.9
Dispositivo: Pixel 2
Android: 9.0

hryer en 22 jul. 2019

👍4

Si es una pantalla de formulario, es posible que esté esperando para definir valores en las entradas, funcionó para mí.

MicaellyUchoa en 26 jul. 2019

👎5

Encontré una solución. No estoy seguro si es a largo plazo, pero esto les permitirá trabajar hasta que se encuentre una solución permanente.
Simplemente borre su efectivo: npm start - --reset-cache
Y reinicia el proyecto.
Funcionó para mí.
Para su información, todavía no expulsé mi proyecto.
Mis dependencias:

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

marchrenno en 5 ago. 2019

👎11 👍1

Usuario de ExpoKit (SDK 34) que pesa aquí. He tenido este problema en todas las versiones de ExpoKit, incluida la última. Intenté aplicar estas correcciones, con algunas modificaciones y, hasta ahora, todo va bien.

El cambio de estilo terminó siendo un poco diferente al de @Hopding , básicamente lo contrario funcionó para mí. Cambié el estilo ExponentEditText en 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>

ya que el cambio a android:editTextBackground no funcionó (tal vez tenga algo que ver con este estilo ExponentEditText que ya está allí). Curiosamente, no tuve que eliminar el accesorio predeterminado configurando underlineColorAndroid en transparent . Tuve el problema del acolchado; sin embargo, sentí que en realidad era una mejora, ya que ya no tenía que lidiar con el relleno intrínseco de TextInput cuando está vacío y estoy tratando de colocar otros componentes cerca de él.

Anteriormente, pude activar el error de manera confiable a través de un botón de diagnóstico que agregué a nuestra aplicación que agregó 500 TextInputs a una SectionList. Diría que se activa el 60% del tiempo en el primer intento, el 90% en el segundo y el 100% en el tercero en mi experiencia. Lo intenté al menos 10 veces sin errores después de realizar el cambio.

llamaluvr en 6 ago. 2019

👀2

Tengo el mismo problema aquí
Enfermera registrada: 0.55.4
Dispositivo: MI 8 Lite
Android: 8.1.0

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

footygoodman en 7 ago. 2019

👍1

Excepción fatal: java.lang.NullPointerException
Intenta invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo

vivo 1804
Versión de Android: 9

viv3kk en 8 ago. 2019

Me está pasando. React Native versión 0.60.4 que se ejecuta en Android 9. Sin embargo, es muy intermitente y poco común.

jacobbeasley en 8 ago. 2019

😕3 👍3

Me está pasando. React Native versión 0.60.4 que se ejecuta en Android 9. Sin embargo, es muy intermitente y poco común.

Lo mismo conmigo también ...

viv3kk en 13 ago. 2019

👀1

Lo mismo aquí, React Native 0.60.4 en Android 9

matheus-erthal en 13 ago. 2019

👍3

Utilizo React Native con Expo y tuve este problema esta mañana.
Primero intenté poner esta línea en mi AppTheme styles.xml así

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

No funcionó, así que busqué otro lugar y finalmente lo puse allí:

<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 perfectamente bien ahora

AlexFenoul en 13 ago. 2019

🎉1

Este choque es tan aleatorio. Mismo seguimiento de pila, v0.60.4. Mismo error. ¿Existe una solución? Alguien sugirió eliminar la carpeta de compilación, pero no veo qué tiene que ver eso con un puntero nulo. La solución siempre parece ser una reconstrucción / repetición

mohamedshuaau en 14 ago. 2019

@armagedan @jacobbeasley et al. el problema _es_ intermitente, por lo que es posible que desee probar el componente de mi comentario anterior para reproducirlo. Ese comentario también proporciona un análisis del problema y una solución que funciona para mí y para muchos otros.

glenn-axsy en 14 ago. 2019

🎉1 👍1

@wxjer ¡ Intento borrar los datos de la aplicación en la configuración y funciona! puedes probarlo

tuvudu en 22 ago. 2019

😕3 🎉3 👎3 👍2

Lo mismo aquí, React Native 0.60.4 en Android 9 y Android 8

¿Alguna solución?

diegotsi en 20 sept. 2019

En caso de que alguien tenga buen ojo para la depuración de Android, aquí está nuestro error centinela que se acaba de informar.

react-native 0.60.4

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

crobinson42 en 20 sept. 2019

Lo mismo aquí, React Native 0.60.5 en Android 9

vuitv en 22 sept. 2019

👍2

¡Hola! Resolvimos esto eliminando la propiedad underlineColorAndroid de nuestro TextInput y agregamos esta línea a styles.xml dentro (android / src / main / res / values / styles.xml)

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

diegotsi en 23 sept. 2019

👍16 👀5 ❤5 🎉5 🚀4 😄1

¿Es este un informe de error?
si
¿Ha leído las Pautas de contribución ?
sí, lamento no poder ofrecer más información sobre esta excepción, excepto este seguimiento de pila porque el informe de fallos se recopiló de Google Analytics, no tengo idea de que vuelva a aparecer esta excepción.
Medio ambiente
Medio ambiente:
SO: macOS Sierra 10.12.6
Nodo: 8.4.0
Hilado: 0.27.5
npm: 5.4.0
Estudio de Android: 3.0
Paquetes: (deseado => instalado)
react-native: 0.51.0 => 0.51.0
reaccionar: 16.0.0-alpha.12 => 16.0.0-alpha.12
Plataforma de destino: Android (7.1.1)
móvil: MIX 2
Android: 7.1.1
java.lang.NullPointerException:
tentar a invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo en
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) en
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) en
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) en
android.graphics.drawable.Drawable.setState (Drawable.java:735) en
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) en
android.graphics.drawable.Drawable.setState (Drawable.java:735) en
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) en
android.graphics.drawable.Drawable.setState (Drawable.java:735) en
android.view.View.drawableStateChanged (View.java:18002) en
android.widget.TextView.drawableStateChanged (TextView.java:4097) en
android.view.View.refreshDrawableState (View.java:18071) en
android.view.View.setPressed (View.java:8543) en
android.view.View.setPressed (View.java:8521) en
android.view.View.onTouchEvent (View.java:11218) en
android.widget.TextView.onTouchEvent (TextView.java:8467) en
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

react-native 0.60.4 yo también

Wendy-WX en 26 sept. 2019

Comencé a encontrar este bloqueo recientemente, RN 0.60.5, principalmente en Android 8/9 (posiblemente 10 también, aún no lo he probado ampliamente).

https://github.com/facebook/react-native/issues/17530#issuecomment -504044357 parece ser el truco para mí. Por lo general, el bloqueo se presentaría dentro de las primeras ~ 5 iteraciones por las que pasa el componente de prueba. Después de agregar esa línea, se ejecutó durante ~ 200 iteraciones sin un bloqueo antes de detenerlo.

editar: Usando el componente de prueba, también puedo reproducir esto de manera confiable en Android 6, aunque nuevamente la solución sugerida parece resolver el problema.

Zloka en 30 sept. 2019

👍3

Lo mismo aquí en RN 0.61

fatihmert en 2 oct. 2019

👍3

Hola chicos, la solución

LuongTruong en 3 oct. 2019

👍4

Este problema aún existe y rompió mi aplicación: todo funcionaba bien, luego agregué una llamada de recuperación y ahora, incluso cuando lo comento, no puedo hacer que la aplicación se ejecute nuevamente: llorar: estoy usando Expo por cierto

EDITAR: solucioné mi problema para expo reinstalando la aplicación expo en mi dispositivo

yesIamFaded en 17 oct. 2019

👎3 🎉2 👀1 🚀1 ❤1 👍1

También encontré este error (RN: 0.61.1, Android 10 api 29). 'npm start --reset-cache' pareció solucionarse.

johnbowdenatfacet en 22 oct. 2019

👎3

@johnbowdenatfacet, es posible que desee probar el componente de prueba mi comentario anterior para confirmar la solución.

glenn-axsy en 22 oct. 2019

Mismo problema.

React-Native 0.59.10
Androide

java.lang.NullPointerException: intento de invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo
en android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
en android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
en android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
en android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)

XingtianXin en 30 oct. 2019

Mismo problema.

caioedut en 30 oct. 2019

👎1

¡Hola! Resolvimos esto eliminando la propiedad underlineColorAndroid de nuestro TextInput y agregamos esta línea a styles.xml dentro (android / src / main / res / values / styles.xml)
<item name="android:editTextBackground"><strong i="7">@android</strong>:color/transparent</item>

Resuelto mi problema, muchas gracias.

ahmedreda97 en 3 nov. 2019

👍5

Acabo de ejecutar (react-native run-android), eso resolvió el problema conmigo

EvertonCosmo en 3 nov. 2019

👎14 😕2 😄2 ❤1

Mismo problema en 0.61.3

lizhengnacl en 6 nov. 2019

👍4

Todavía estoy enfrentando el problema. Tenemos algunos usuarios que informan fallas en la aplicación de Android, pero sucede de manera tan aleatoria que no puedo reproducirlo.

pedrosimao en 6 nov. 2019

👍4

+1, también me pasó a mí

oren-meiron en 7 nov. 2019

@pedrosimao, es posible que desee probar el componente de prueba mi comentario anterior para reproducir de manera confiable la falla. Ese comentario también apunta a una solución para el problema.

glenn-axsy en 7 nov. 2019

Reduje el problema en la entrada para mí, que se importa desde una base nativa.

Actualizado:
Reinicié mi PC y teléfono y luego volví a ejecutar, funcionó a las mil maravillas :)

Nazeerahmad1996 en 8 nov. 2019

👎7 👍2

Yo también tenía esto. Resolví el problema volviendo a ejecutar expo a través de expo r -c

ErayTuncer en 13 nov. 2019

👎3

Reportando el mismo problema para RN 0.59.10

vovkind en 19 nov. 2019

Descubrí que las pruebas manuales eran muy impredecibles, así que escribí un componente para probar automáticamente algunos de los escenarios que la gente ha estado informando anteriormente. Encontrará el componente a continuación. Solo tiene que renderizarlo en algún lugar para que haga su trabajo.
Al hacer esto, descubrí que solo necesita agregar lo siguiente al AppTheme en styles.xml como lo sugiere @Hopding
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>
No se requería nada más, y _no era necesario_ evitar configurar underlineColorAndroid , por lo que no importaba que React Native ahora lo configurara de forma predeterminada.
La principal desventaja de esta solución es que debe cambiar el estilo de sus TextInputs para permitir la pérdida resultante de relleno, y también pierde el comportamiento real de subrayado, lo que para nosotros fue un beneficio, ya que siempre lo configuramos como "transparente". para ser coherente con iOS. Si lo necesita, puede crear un componente de envoltura que observe onFocus y onBlur y haga su propio subrayado.
Mi versión de React Native es 0.57.3
Aquí hay algunas otras cosas que encontré usando mi componente de prueba:
No pude causar el bloqueo en absoluto en mi dispositivo de tableta Android de baja especificación. Sin embargo, fue bastante fácil de reproducir en mi teléfono Samsung S6 Edge con Android 7. Supongo que hay una condición de carrera que necesita un dispositivo más rápido para provocarla.
Desplazar las entradas de texto no hizo ninguna diferencia, y pude reproducir fácilmente el problema sin siquiera usar un ScrollView.
No era necesario ingresar texto. Simplemente cambiar el enfoque fue suficiente para provocar el accidente.
No importaba el color en el que estableciera el subrayado, incluso undefined causó el bloqueo, pero tal vez esperaría eso, dado que RN ahora lo establece de forma predeterminada en "transparente"
Tener un buen número de TextInputs mostrando a la vez marcó la diferencia, ya que el bloqueo ocurrió más rápido con 100 que solo con 10 en la pantalla.
No pude reproducir el bloqueo con displayForMs: 0 lo que sugiere que solo ocurre cuando los TextInputs se han creado recientemente.
Si no quiere quedarse mientras prueba, puede capturar la salida de adb logcat y buscar los mensajes de consola producidos por el componente y el informe de fallas.
Aquí está mi componente de prueba en caso de que desee utilizarlo. Los parámetros de prueba están configurados para causar un bloqueo en menos de 30 segundos para mí.
/**
 * 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;

Intenté esto, pero el teclado no aparecía en TextInputs. ¿Alguna solución?

saketkumar en 20 nov. 2019

Gracias por probar mi componente @saketkumar.

No recuerdo si el teclado debe aparecer para esta prueba, aunque esperaría que aparezca cuando la entrada de texto esté enfocada. ¿Estás usando un dispositivo real o un emulador?

¿Podía ver que el cursor aparecía en las entradas de texto a medida que se enfocaban y el componente podía reproducir el bloqueo por usted?

glenn-axsy en 21 nov. 2019

Lo mismo

VadimCpp en 11 dic. 2019

Ocurre en reaccionar 0.59 en una variedad de teléfonos Android.

Ocurre aleatoriamente en componentes con TextInput anidados dentro de Flatlist

Intenté establecer underlineColorAndroid={null} atrribute en TextInput como se explica en este hilo, pero el error persiste

bhaskar-c en 13 dic. 2019

Tuve que reiniciar mi teléfono y reinstalar EXPO para que se arreglara. Si eso no funciona para usted, intentaría borrar su caché y borrar el caché de la APLICACIÓN EXPO.

No tengo idea de cómo ocurrió ese ERROR en primer lugar. No pude recrearlo ni averiguar cómo evitar que vuelva a suceder.
Simplemente comenzó y no importa lo que cambie en mi código, no lo solucionó. Ciertamente es el problema con la APLICACIÓN EXPO porque veo el ERROR en la APLICACIÓN pero no en mi consola ni en ningún otro lugar.

SamuelAripov en 14 dic. 2019

🚀2 ❤2 🎉2 👍2

+1 Todavía existe un error en RN 0.59.9. informado de firebase crashlytics

johnjoshuadablo en 19 dic. 2019

👍2

¿El primero en obtener este error en RN 0.61?

AliRawash en 28 dic. 2019

Sin embargo , obteniendo el mismo error en RN 0.61, la solución de
Este es un problema grave, ya que me sucedió por primera vez en un entorno de preproducción, y nunca hubiera podido rastrearlo sin crashlytics, ya que el comportamiento errático dificulta la reproducción.

PiPoutch en 30 dic. 2019

👍2

¿Es este un informe de error?
si
¿Ha leído las Pautas de contribución ?
sí, lamento no poder ofrecer más información sobre esta excepción, excepto este seguimiento de pila porque el informe de fallos se recopiló de Google Analytics, no tengo idea de que vuelva a aparecer esta excepción.
Medio ambiente
Medio ambiente:
SO: macOS Sierra 10.12.6
Nodo: 8.4.0
Hilado: 0.27.5
npm: 5.4.0
Estudio de Android: 3.0
Paquetes: (deseado => instalado)
react-native: 0.51.0 => 0.51.0
reaccionar: 16.0.0-alpha.12 => 16.0.0-alpha.12
Plataforma de destino: Android (7.1.1)
móvil: MIX 2
Android: 7.1.1
java.lang.NullPointerException:
tentar a invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo en
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) en
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) en
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) en
android.graphics.drawable.Drawable.setState (Drawable.java:735) en
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) en
android.graphics.drawable.Drawable.setState (Drawable.java:735) en
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) en
android.graphics.drawable.Drawable.setState (Drawable.java:735) en
android.view.View.drawableStateChanged (View.java:18002) en
android.widget.TextView.drawableStateChanged (TextView.java:4097) en
android.view.View.refreshDrawableState (View.java:18071) en
android.view.View.setPressed (View.java:8543) en
android.view.View.setPressed (View.java:8521) en
android.view.View.onTouchEvent (View.java:11218) en
android.widget.TextView.onTouchEvent (TextView.java:8467) en
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

cinocai en 8 ene. 2020

Esto sucede cuando cambio algo de estilo, como eliminar justifyContent o algo así y reiniciar la aplicación funciona temporalmente.

Sargnec en 8 ene. 2020

@cinocai , @Sargnec et al, este hilo de comentarios se está anteriormente

Varias personas anteriores lo han utilizado para reproducir con éxito este problema y verificar la solución, que también se menciona en ese comentario.

glenn-axsy en 9 ene. 2020

👍3

@ glenn-axsy: Gran trabajo con el componente de prueba, fue muy útil para comprender mejor el problema.
Pero estoy luchando por encontrar una solución.

Como sugirió al configurar displayForMs: 0 , no se bloquea. Si no me equivoco, al hacerlo, los 100 TextInputs nunca se desmontan (solo actualizaciones), tampoco nuevos.

Intenté configurar displayForMs: 3000 sí mismo e hice otros 2 cambios, que mantuvieron todos los 100 montados (solo actualización) en cada estado establecido.

Cambios

clave constante = this.state.startKey + i + ""; ---> tecla const = ${i} ;
Cheque deshabilitado if (this.state.showInputs) { dentro del render.

código


/**
 * 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;

Ambos cambios aseguraron que llamar a _showInputs y _unshowInputs no volverá a montar los TextInputs, ni montará ninguno nuevo (máximo 100).
Y no se bloquea como se esperaba.

Finalmente, para asegurarse de si realmente se está volviendo a montar (una gran cantidad de TextInputs) lo que causa el problema. Intenté reproducirlo en la aplicación en la que estoy trabajando, en la que se informó del bloqueo.

En la aplicación hay 2 pantallas, una con 2 TextInputs y la otra con 4, seguí navegando de un lado a otro de las pantallas, lo que, por supuesto, vuelve a montar todo el contenido de la pantalla y, finalmente, después de un tiempo, pude obtener el bloqueo.

Con esto, podría inferir que no dejar que TextInput desmonte no es una solución viable. ¡Pero todavía no tengo idea de qué está causando esto exactamente!

NOTA

No creo que esté relacionado con la propiedad underlineColorAndroid , porque he intentado anularla con <item name="android:editTextBackground"><strong i="18">@android</strong>:color/transparent</item> , y no hay diferencia. [Editado: en realidad, soluciona el problema por ahora]
También pude bloquear sin usar ScrollView .
Y enfocar el TextInput tampoco fue necesario para que se bloquee, simplemente volver a montar esos 100 TextInputs resultó en un bloqueo.

¡Gracias!

rimzici en 13 ene. 2020

👍1

@rimzici Sí, eso es cierto. El bloqueo está relacionado con volver a montar / crear instancias de un texto de edición, a veces los elementos de diseño de fondo son nulos. Pero curiosamente, cuando estableces <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> eso no sucederá. Parece que los elementos de diseño se reciclaron de alguna manera después de la clonación y, cuando se establece un fondo, puede tener un valor predeterminado.

sunnylqm en 14 ene. 2020

Gracias @rimzici.

Es decepcionante escuchar que simplemente configurar <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> no lo solucionó. Al menos ahora tiene una forma de reproducir fácilmente el error y puede probar algunas otras cosas.

Publique cualquier observación adicional que pueda tener.

glenn-axsy en 14 ene. 2020

¡Gracias @sunnylqm y @ glenn-axsy! Tienes razón, la configuración de <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> se soluciona de hecho.

Olvidé que tenía un tema de bienvenida configurado en mi Actividad principal, para cubrir la pantalla blanca mientras se carga JS.

Ahora puedo confirmar que la solución es eficaz para prevenir accidentes.

Se actualizará con más información.

rimzici en 14 ene. 2020

👍3

react-native 0.61.5 <- ¡también está aquí!

felansu en 16 ene. 2020

👍1

react-native 0.62.0.rc-1 <- ¡también está aquí!

crobinson42 en 25 ene. 2020

👍2

Mismo error en [email protected]

SamiChab en 23 feb. 2020

👍1

Alcanzar muchas ocurrencias del mismo error detectado por Sentry: https://sentry.io/share/issue/ac1e7c55f1594b118f0faaf8d11de5c4/

En RN 0.59.9

fungilation en 24 feb. 2020

Mismo error en RN 0.55.4

pinguo-zhouwei en 2 mar. 2020

Mismo problema en RN 2.0.1

ApWin en 4 mar. 2020

😄4 😕2 👀1

no establezca los accesorios 'underlineColorAndroid' en ningún TextInput y elimine todo el fondo de entrada de texto por estilos nativos.

ir a android \ app \ src \ main \ res \ values \ styles.xml

cambia eso como a continuación:

Babar-Memon en 11 mar. 2020

Lo mismo en RN 0.61.5

cnkyrpsgl en 12 mar. 2020

Descubrí que las pruebas manuales eran muy impredecibles, así que escribí un componente para probar automáticamente algunos de los escenarios que la gente ha estado informando anteriormente. Encontrará el componente a continuación. Solo tiene que renderizarlo en algún lugar para que haga su trabajo.
Al hacer esto, descubrí que solo necesita agregar lo siguiente al AppTheme en styles.xml como lo sugiere @Hopding
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>
No se requería nada más, y _no era necesario_ evitar configurar underlineColorAndroid , por lo que no importaba que React Native ahora lo configurara de forma predeterminada.
La principal desventaja de esta solución es que debe cambiar el estilo de sus TextInputs para permitir la pérdida resultante de relleno, y también pierde el comportamiento real de subrayado, lo que para nosotros fue un beneficio, ya que siempre lo configuramos como "transparente". para ser coherente con iOS. Si lo necesita, puede crear un componente de envoltura que observe onFocus y onBlur y haga su propio subrayado.
Mi versión de React Native es 0.57.3
Aquí hay algunas otras cosas que encontré usando mi componente de prueba:
No pude causar el bloqueo en absoluto en mi dispositivo de tableta Android de baja especificación. Sin embargo, fue bastante fácil de reproducir en mi teléfono Samsung S6 Edge con Android 7. Supongo que hay una condición de carrera que necesita un dispositivo más rápido para provocarla.
Desplazar las entradas de texto no hizo ninguna diferencia, y pude reproducir fácilmente el problema sin siquiera usar un ScrollView.
No era necesario ingresar texto. Simplemente cambiar el enfoque fue suficiente para provocar el accidente.
No importaba el color en el que estableciera el subrayado, incluso undefined causó el bloqueo, pero tal vez esperaría eso, dado que RN ahora lo establece de forma predeterminada en "transparente"
Tener un buen número de TextInputs mostrando a la vez marcó la diferencia, ya que el bloqueo ocurrió más rápido con 100 que solo con 10 en la pantalla.
No pude reproducir el bloqueo con displayForMs: 0 lo que sugiere que solo ocurre cuando los TextInputs se han creado recientemente.
Si no quiere quedarse mientras prueba, puede capturar la salida de adb logcat y buscar los mensajes de consola producidos por el componente y el informe de fallas.
Aquí está mi componente de prueba en caso de que desee utilizarlo. Los parámetros de prueba están configurados para causar un bloqueo en menos de 30 segundos para mí.
/**
 * 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;

¡Puedo confirmar que esto me lo arregló!

gagangoku en 14 mar. 2020

👍3 🎉2 🚀1 ❤1 😄1

Me alegro de que mi componente de prueba y la solución sugerida hayan funcionado para usted @gagangoku

Para aquellos que quieran verlo en contexto, el enlace está aquí.

Quizás tenga la amabilidad de agregar ese enlace a su comentario.

glenn-axsy en 16 mar. 2020

La solución de @ glenn-axsy funcionó para mí (al igual que el componente de prueba 👏👏👏), pero me encontré con algunos problemas en el camino que pueden ayudar a otra alma perdida:

Mi AppTheme se reemplazó incorrectamente en el archivo AndroidManifest.xml , debido a un error que cometió un desarrollador al agregar una actividad de pantalla de presentación. Una vez que arreglé y confirmé que AppTheme realmente se estaba usando (por ejemplo, cambiando el color del texto predeterminado y viéndolo en la aplicación), la solución realmente funcionó.

¡Muchas gracias y buena suerte!

Landerson352 en 20 mar. 2020

👍3

Me pasa usando expo. Ejecuto este comando.
sudo expo start -c y el problema desapareció.

HakimAsa en 5 abr. 2020

👍1

@HakimAsa Sugiero usar el componente de prueba para asegurarse de que realmente se haya ido.

glenn-axsy en 6 abr. 2020

👍1

Lo extraño es que el código ha estado funcionando durante un mes sin ese problema. Pero después de recargar repetidamente los cambios, tuve un problema ayer ... De todos modos, probaré tu sugerencia @ glenn-axsy

HakimAsa en 6 abr. 2020

👍2

En mi caso, estaba ocurriendo dentro de FlatList cuando renderItem devuelve <TextInput /> . Así que resolví ese problema devolviendo <><TextInput /></>

MahmoudHemaid en 13 abr. 2020

@MahmoudHemaid, el problema es tan difícil de reproducir que es posible que no lo haya resuelto. Más información aquí .

glenn-axsy en 14 abr. 2020

👍1

android.graphics.drawable.Drawable $ constantstate, newdrawable en un error de referencia nulo que se obtiene mientras hago clic en una imagen, ubicada en la esquina más a la derecha. Y esa imagen actuó como un botón de alternancia. Estoy usando RN 0.61.2. Que alguien me ayude a resolver el problema. Sucede solo en apk independiente

anuscaria en 17 abr. 2020

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

Al hacer esto, descubrí que solo necesita agregar lo siguiente al AppTheme en styles.xml como lo sugiere @Hopding

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

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

El ejemplo más simple sería simplemente crear un EditText con un AttributeSet nulo y sin (0) atributos de estilo predeterminados:

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

ReactTextInput pueden ser anulados por subclases que deseen proporcionar su propia instancia de EditText .

El constructor de Android EditText :

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

que llama al constructor View ( docs )

Seguiré investigando. Gracias

fabriziobertoglio1987 en 17 abr. 2020

👍1

Hola @ glenn-axsy, he estado luchando con esto durante horas, así que realmente espero que puedas ayudarme. Estoy usando su AndroidTextInputTest en mi teléfono Android. Estoy ejecutando React Native con Typecript si eso importa y lo hago a través de Expo. Esto significa que no tengo nada de tipo EditText.
Reaccionar nativo en package.json = "react-native": "^ 0.61.4"

Usé los params:

const params = {
underlineColors: ["rojo", indefinido, "transparente", "rgba (0, 0, 0, 0)"], // Los colores a probar
numberOfInputs: 100, // Cuántos TextInput se deben representar a la vez
focusIntervalMs: 200, // Con qué frecuencia cambiar el enfoque entre ellos
displayForMs: 3000, // Cuánto tiempo mostrarlos (establecido en 0 para indefinido)
delayDisplayForMs: 10, // Cuánto tiempo demorar entre pantallas
withScrollView: false, // si usar un ScrollView
};

Y mi resultado antes de obtener el "Intento de invocar el método virtual" fue:

Prueba con params = {"underlineColors": ["red", null, "transparente", "rgba (0, 0, 0, 0)"], "numberOfInputs": 100, "focusIntervalMs": 200, "displayForMs": 3000, "delayDisplayForMs": 10, "withScrollView": falso}
Los parámetros de calendarVisible son verdaderos y el estado es verdadero
Probando underlineColor = red
Probando underlineColor = undefined
Probando underlineColor = transparente
Probando underlineColor = rgba (0, 0, 0, 0)
Probando underlineColor = red
Probando underlineColor = undefined
Probando underlineColor = transparente

Entonces, mi pregunta desde aquí es, ¿cómo puedo usar estos parámetros y la salida que vi antes del bloqueo para diagnosticar lo que está fallando en mi aplicación?

Gracias por cualquier ayuda.

ucheNkadiCode en 30 abr. 2020

@ucheNkadiCode Es una prueba para reproducir rápidamente el problema, no una solución. La solucion es

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

sunnylqm en 30 abr. 2020

@ucheNkadiCode Es una prueba para reproducir rápidamente el problema, no una solución. La solucion es
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>

@sunnylqm Estoy un poco confundido porque estoy usando el uso de react native, así que no uso el elemento en ninguna parte de mi código.

Yo uso un TextInput que se ve así:

Entrada de texto
ref = {clave}
clave = {clave}
marcador de posición = {clave}
underlineColorAndroid = {underlineColor}
style = {styles.textInput}

Gracias

ucheNkadiCode en 30 abr. 2020

@ucheNkadiCode

Pero para expo, tal vez necesite expulsar primero para modificar configuraciones como esta

sunnylqm en 30 abr. 2020

@ucheNkadiCode

Pero para expo, tal vez necesite expulsar primero para modificar configuraciones como esta

Sí, ese sería el problema. No quiero pagar el precio de expulsar mi aplicación nativa de reacción tan pronto en su desarrollo. Espero encontrar una solución que me mantenga en React Native.

Gracias por tu ayuda

ucheNkadiCode en 30 abr. 2020

@ axsy-dev @ucheNkadiCode

mi comentario estaba trabajando en esa dirección, para solucionar esto en una solicitud de extracción para evitar los problemas relacionados con TextInput prop underlineColorAndroid . ReactNative establece el tema de una manera programática ... por favor revise mi comentario y regrese a mí con algunos comentarios ya que no pude resolver este problema y estoy trabajando en otra solicitud de extracción ahora. Gracias

De hecho, pude resolver este problema reescribiendo el método react nativo ReactTextInput

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

Pero esto es solo deshabilitar el estilo pasado al componente EditText con getThemedContext()

Además, la pila nos dice que este error es provocado por ReactEditText.onTouchEvent , por lo que cuando el usuario toca el componente TextInput .

fabriziobertoglio1987 en 30 abr. 2020

mi comentario estaba trabajando en esa dirección, para solucionar esto en una solicitud de extracción para evitar los problemas relacionados con TextInput prop underlineColorAndroid . ReactNative establece el tema de una manera programática ... por favor revise mi comentario y regrese a mí con algunos comentarios ya que no pude resolver este problema y estoy trabajando en otros requisitos de extracción ahora.
De hecho, pude resolver este problema reescribiendo el método react nativo ReactTextInput
<strong i="12">@Override</strong>
 protected EditText createDummyEditText() {
   return new EditText(getThemedContext(), null, 0);
 }
Pero esto es solo deshabilitar el estilo pasado al componente EditText con getThemedContext()
Además, la pila nos dice que este error es provocado por ReactEditText.onTouchEvent , por lo que cuando el usuario toca el componente TextInput .

@ axsy-dev @ fabriziobertoglio1987. Entonces no tengo ningún elemento que pueda encontrar en el directorio de mi proyecto con ReactEditText y tampoco tengo ningún archivo .java en mi directorio. Estoy usando TypeScript con React native, por lo que la mayoría de mis archivos son .tsx o .ts con la excepción de muchos node_modules.

Desafortunadamente, no estoy usando Native Android.

ucheNkadiCode en 30 abr. 2020

@ucheNkadiCode para resolver esto, ahora necesita expulsar; de lo contrario,

fabriziobertoglio1987 en 30 abr. 2020

@ucheNkadiCode Me temo que no uso Expo, pero parece que @sunnylqm sabe de lo que está hablando

glenn-axsy en 30 abr. 2020

Acabo de enfrentar el mismo problema en la expo.
Lo intenté: watchman watch-del-all && expo r -c
pero aún así son buenas noticias.

mobeendev en 13 may. 2020

Estoy enfrentando el mismo problema, que desaparece si cambio mi TextInput en un texto.

Este comentario de hace 2 años sigue siendo válido.

Lo he reducido a un <TextInput> se representa en una FlatList. Cuando reemplazo esto con <Text> , el problema desaparece.

Restablecer la caché parece ayudar brevemente, pero mi aplicación se bloqueaba nuevamente después de algunos clics en los botones.

diegoboston en 20 may. 2020

@diegoboston probando con mi componente de prueba, puede reproducir esto sin FlatList. Puede encontrar el componente de prueba y una solución alternativa en mi comentario aquí .

glenn-axsy en 21 may. 2020

Estoy usando expo SDK 37 que usa react native 0.61 internamente.
Es extraño que no haya tenido ningún problema, pero de repente, cuando reinicié el constructor, apareció este problema. ¿No está arreglado todavía?

sathwik77 en 22 may. 2020

RN 0.62.2 + Android mismo aquí.
Este error se invoca en modo de producción.

mym0404 en 22 may. 2020

Borrar la caché de la aplicación de la configuración resolvió mi problema, pero no parece una solución aceptable para esto.

sathwik77 en 22 may. 2020

Trabajé en este tema y estos son mis hallazgos (la publicación anterior

1) Sabemos que agregar android:editTextBackground con color/transparent al tema soluciona el problema

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

2) Cambiar el método ReactEditTextShadowNode createDummyEditText al siguiente código también soluciona el problema (me parece que deshabilita todos los estilos para EditText)

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

Lo que tengo entendido ahora de este problema es que en Android puede establecer estilos de dos maneras

1) Escribir XML como elementos y estilos html y aplicarlos
2) Llame al constructor EditText o View y pase el contexto y otros atributos / estilos con él.

ReactEditText usa createDummyEditText para crear una instancia EditText y luego cambiar algunos estilos (relleno, diseño, etc.), pero esto es algo relacionado con el diseño (relleno, márgenes) y no colores de fondo, etc. De hecho, intenté cambiar esas líneas de código a setBackgroundTint a red o transparent y no funcionó ...

https://github.com/facebook/react-native/blob/95546d932f03f9af990c2a11576a4c6297136fd4/ReactAndroid/src/main/java/com/facebook/react/views/textinput/ReactTextInputShadowL85 -L100#.java

el color de fondo se cambia con el siguiente método

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

El lunes intentaré de nuevo cambiar el método setBackgroundColor y establecer el color de fondo transparente en tiempo de ejecución ... Esa sería mi primera pista para resolver este problema

fabriziobertoglio1987 en 22 may. 2020

👍1

La pila falla en 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 es el último método llamado antes de fallar, el resto de la pila es de la biblioteca OpenSource sdk de Android y no es la causa real del problema

La configuración de android:editTextBackground probablemente supere algunos valores de elementos del tema predeterminado que está causando el problema. El problema está relacionado con el constructor que pasa getThemedContext que también incluye el tema

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

Por esta razón, creo que la solución debe buscarse en cómo React maneja el contexto ...

fabriziobertoglio1987 en 22 may. 2020

👍1

¡Los chicos que reiniciaron el empaquetador y borrar la caché funcionaron para mí!

Pero esta es la solución temporal, ¿cómo puedo arreglar este permanente?

dev-sathish en 18 jun. 2020

Traté de configurar programáticamente en Java el color de fondo en transparente, pero aún desencadena el error de tiempo de ejecución, lo que me hace creer el siguiente código

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

es simplemente una lógica primordial de

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

que es claramente la causa del problema en la pila

Ese método es responsable de configurar el estilo del EditText,

El problema es que la pila de problemas original parece tener un registro diferente y parece no estar relacionada con el caso de prueba adjunto. La siguiente pila se originó a partir de ReactEditText.onTouchEvent que significa que el usuario está tocando TextInput y se activa el error.

ERROR DE REGISTRO ORIGINAL

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)

Otro tipo de errores https://github.com/facebook/react-native/issues/17530#issuecomment -376917781

OTROS ERRORES DE REGISTRO

Excepción fatal: java.lang.NullPointerException: intento de invocar el método virtual 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' en una referencia de objeto nulo en android .graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875) en android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158) en android.graphics.CondrawableOtainer.Drawable.Drawable : 433) en android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258) en android.view.View.computeOpaqueFlags (View.java:16791) en android.view.View.setBackgroundDrawable (View.java:21710) en android.view.View.setBackground (View.java:21603) en android.view.View.(View.java:5547) en android.widget.TextView.(TextView.java:1135) en android.widget.EditText.(EditText.java:107) en android.widget.EditText.(EditText.java:103) en android.widget.EditText.(EditText.java:99) en android.widget.EditText.(EditText.java:95) en com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:92) en com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:94) en com.facebook.react.views.textinput. com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:46) en com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:218) en com.facebook.react.uimanager.UIViewOperationOQueue $ Create. ejecute (UIViewOperationQueue.java:150) en com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:923) en com.facebook.reactIVOimaniewCallback.Uuar8) en com.facebook.reactIVOimaniewCallback. en com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:31) en com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreog rapher.java:136) en com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:107) en android.view.Choreographer $ CallbackRecord.run (Choreographer.java:909) en android. view.Choreographer.doCallbacks (Choreographer.java:723) en android.view.Choreographer.doFrame (Choreographer.java:655) en android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:897) en android.os.Handler .handleCallback (Handler.java:789) en android.os.Handler.dispatchMessage (Handler.java:98) en android.os.Looper.loop (Looper.java:164) en android.app.ActivityThread.main (ActivityThread. java: 6938) en java.lang.reflect.Method.invoke (Method.java) en com.android.internal.os.Zygote $ MethodAndArgsCaller.run (Zygote.java:327) en com.android.internal.os.ZygoteInit .main (ZygoteInit.java:1374)

por otro lado me pregunto si https://github.com/facebook/react-native/issues/17530#issuecomment -504044357 es un ejemplo aceptable, ya que no causa manualmente el error al hacer clic en TextInput sino al hacerlo programáticamente ...

Estoy seguro de que alguien en esta discusión hará una investigación adecuada y resolverá este problema. ¡Muchas gracias y buena suerte! : smiley:

fabriziobertoglio1987 en 18 jun. 2020

👍1

Chicos, intenten ejecutar "npm install" de nuevo. Funcionó para mí.

03twinklevaid en 26 jun. 2020

👎20 😕1

Intenté agregar <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> y esto evita que la aplicación se bloquee, sin embargo, el cuadro de texto sigue parpadeando entre grande y pequeño y no se puede usar, ¿alguien más ha tenido esto?

paulsjohnson91 en 30 jun. 2020

En mi caso, uso componentes con estilo, establezco un nombre de utilería que es "correcto", creo que es especial, cambio a "isRight" resolvió mi problema.

Micky40086 en 1 jul. 2020

Tome la versión de lanzamiento y pruébelo en esa apk que nunca vio este error

dev-sathish en 7 jul. 2020

👎4

El comentario original informa un problema obtenido a través del informe de errores de análisis, y no un error en el desarrollo, creo que debemos mantenernos enfocados.

douglasjunior en 7 jul. 2020

Puede probar ambos y cualquiera de los puntos, el que funcione para su aplicación:

Elimina los datos de la caché de tu aplicación y deja que se recargue
Reinicie el servidor usando npm start --reset-cache

MuktaB16 en 14 jul. 2020

👎4

https://github.com/facebook/react-native/pull/24183 Intento depurar esto una vez más.

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

fabriziobertoglio1987 en 16 jul. 2020

parece que hay un problema relacionado abierto https://issuetracker.google.com/issues/37068452 en el proyecto de Android

Cree una implementación de Drawable personalizada que no anule getConstantState ().
Cree una instancia de LayerDrawable, con una instancia del elemento de diseño personalizado como elemento secundario.
Llame a mutate () en 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();

En nuestro caso, el error de tiempo de ejecución se activa en esta línea desde ReactEditText (hereda 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á la información del tiempo de ejecución de JavaScript a Android como JSON a través de ReactNativeBridge, la API de Java de Android usará la información para crear una instancia View y la inflará (mostrará) en la pantalla.

Se pasará un Context objeto a la View constructor que se inflará el diseño deault para que <TextInput /> , a continuación, en cualquier momento cambiamos un puntal como underlineColorAndroid , nos llamará a un método de API de Android específico, por ejemplo. setUnderlineColorAndroid("red") y la API de Android se encargarán de actualizar el color de subrayado de <TextInput /> .

Si 37068452 está causando el tiempo de ejecución, entonces debemos ser mutating() a BackgroundDrawable tal vez cambiando underlineColor , pero el error se activa en el constructor View cuando pasamos el Context .

Intentaré depurar la pila de Android, pero primero intentaré transformar el ejemplo actual en un Ejemplo mínimo reproducible y eliminar las propiedades que no sean esenciales para reproducir el error.

fabriziobertoglio1987 en 16 jul. 2020

👍2

Pude crear un ejemplo mínimo reproducible.
El problema se debe al apoyo de la clave TextInput.

Volver a renderizar un gran número de componentes TextInput con apoyo clave provocará el error de tiempo de ejecución.
El número de TextInput s parece crucial para desencadenar el bloqueo.

   // 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++) { ..

El bloqueo no se reproduce si elimina la propiedad clave TextInput . Investigaré e intentaré solucionarlo. Ejecute este ejemplo para reproducirlo.

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;

El mismo problema se puede reproducir con una FlatList, si su data prop incluye un key , index o id como este [{ key: "1"}, {key: "2"}, .. {key: "5000"}] , automáticamente key se utilizará para su Lista y provoca el tiempo de ejecución. Eliminar esas claves de la matriz data corrige el error y elimina el almacenamiento en caché 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;

fabriziobertoglio1987 en 17 jul. 2020

👀6 👍4

El problema parece deberse a esta línea de código. Comenté la línea y la reemplacé con const key = 500; y el error no se volvería a reproducir.

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

Un ejemplo es con keyExtractor(item, ii) con item = {"key":"450"} , ii = 50 y el valor de retorno key = 450 provocará el bloqueo, pero creo que esta no es la causa real, sino simplemente indicación de que la tecla está causando el problema. Seguiré investigando esto. Estoy buscando un trabajo. Muchas gracias. Te deseo un buen fin de semana.

| CON TIEMPO DE FUNCIONAMIENTO |
|: -------------------------: |
| |

| SIN TIEMPO DE EJECUCIÓN |
|: -------------------------: |
| |

fabriziobertoglio1987 en 18 jul. 2020

👀4 👍2

@ fabriziobertoglio1987 Tengo una conclusión similar https://github.com/facebook/react-native/issues/17530#issuecomment -573934341, es decir, relacionada con volver a montar / instanciar un texto de edición. En ese momento no entendía por qué la entrada de texto se recrearía / reinstalaría cuando parecía no tener ninguna razón para hacerlo. Ahora parece que las claves podrían ser la causa.

sunnylqm en 18 jul. 2020

🚀1 ❤1 👍1

El error lanza desde aquí

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

donde la matriz mDrawableFutures no es nula pero algunos de sus elementos secundarios podrían ser nulos.

mDrawableFutures solo se puede clonar de otros

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

lo que significa que no era nulo cuando se estaba clonando, pero de alguna manera algunos de sus elementos secundarios se destruyeron después.
Lo siguiente es mi suposición: los accesorios clave desencadenarían un proceso diferente, que construiría nodos de sombra para entradas de texto. Y durante el proceso, los estados dibujables se clonarían. Sin embargo, podría haber una condición de carrera / operación no segura para subprocesos que destruyó algunos de los estados dibujables mientras aún estaban en uso. @ fabriziobertoglio1987

sunnylqm en 18 jul. 2020

👀2 🚀1 ❤1 👍1

muchas gracias @sunnylqm Creo en el poder de la colaboración y estoy tratando de conseguir este pull request para encontrar trabajo.

Creo que el problema está relacionado con algunos parámetros sucios pasados al usar key y 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

Tiene razón, de hecho, este problema se experimenta solo cuando se usa el componente TextInput . Por ejemplo, reemplazando TextInput con Text en renderItem solucionará este problema

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

La diferencia entre usar Text y TextInput es que const element será un ForwardRef con TextInput . En el caso siguiente, TextInput crea un tiempo de ejecución cuando llega a una determinada clave. También eliminé underlineColorAndroid="transparent" y no es la causa del error, pero lo dejé en los registros a continuación.

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 devuelve un 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

Creo que se llama a un método en la API de Java desde la API de TextInput javascript, pero con parámetros faltantes / sucios. Esto puede estar causando el error de tiempo de ejecución NPE, pero necesito investigar todos los aspectos de la API JS TextInput para comprender el motivo.

Creo que el key prop está causando problemas porque el mecanismo React se basa en comparar el key prop, si no hay un mecanismo de prop clave, entonces no se almacena en caché y no hay error subsiguiente .

Mañana intentaré establecer un punto de interrupción en el código al que hizo referencia en el mensaje anterior

Muchas gracias por la ayuda. Con suerte, podremos escribir juntos una solicitud de extracción y solucionar este problema. Les deseo una buena noche. Fabrizio

fabriziobertoglio1987 en 18 jul. 2020

❤2 🎉2 👍2

@sunnylqm

DEMASIADO LARGO NO LEER

Estoy escribiendo una solicitud de extracción para solucionar este problema. Es muy fácil de arreglar.

El problema se debe al BackgroundDrawable predeterminado utilizado en la inicialización de EditText

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

El Drawable es el del tema que estamos usando Theme.AppCompat.Light.NoActionBar . Se puede cambiar Drawable cambiando los archivos xml de plantilla utilizados para inicializar el proyecto de Android react-native con el script de inicio react-native.

Usaré uno proporcionado por defecto desde Android o crearé un elemento de diseño personalizado y lo incluiré en cada inicialización del proyecto.

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>

o

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>

VERSIÓN LARGA

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

Lo siguiente es mi suposición: los accesorios clave desencadenarían un proceso diferente, que construiría nodos de sombra para entradas de texto. Y durante el proceso, los estados dibujables se clonarían. Sin embargo, podría haber una condición de carrera / operación no segura para subprocesos que destruyó algunos de los estados dibujables mientras aún estaban en uso.

Esta línea android:editTextBackground corrige el error, pero ¿QUÉ hace esta línea en ReactNative?

1) El AndroidManifest.xml asigna el 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) Cambiamos AppTheme en 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 constructor llamará super(context) . El objeto context incluye layout y theme ( AppTheme ).

El constructor View obtendrá la información de estilo / tema / diseño del objeto context y creará una instancia de EditText con esos estilos (xml es como html), lo inflará y mostrarlo en la pantalla.

Android usa xml como html para representar vistas estáticas, mientras que Java se usa para representar contenido dinámico (como JavaScript en la Web).

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

4) ReactNative construye sobre la API Context , pero utilizará el mismo patrón de 1-3.
Inicialice las vistas con el objeto context , luego use JavaScript para realizar cambios dinámicos sin cambiar la instancia context directamente, pero usando el puente react-native través de la API de Android.

| ANTES | DESPUÉS | DESPUÉS con accesorios de estilo TextInput |
|: -------------------------: |: -------------------- -----: |: -------------------------: |
| | | |

Estoy preparando una solicitud de extracción para cambiar el Drawable predeterminado utilizado para EditText en la inicialización.
El Drawable de Theme Theme.AppCompat.Light.NoActionBar está causando este problema, reemplazarlo con otro Drawable debería solucionarlo. El dibujable <strong i="27">@android</strong>:drawable/edit_text es demasiado alto para nuestro diseño. La vista principal se adapta a la altura de diseño predeterminada si la altura es mayor que la principal. Creo que ReactNative está usando un dibujable predeterminado con baja altura y luego lo adapta con match_parent a la vista principal.

1) OPCIÓN 1 - Encuentra un dibujable de otro tema

2) OPCIÓN 2
Cree un nuevo elemento de diseño en la plantilla de react-native basado en el disponible en el proyecto de Android con una altura baja para siempre coincidir con la vista parental.

Agregué a mi proyecto de Android el siguiente dibujable con una altura de pocos píxeles

Screenshot from 2020-07-20 13-34-54

El dibujable de fondo se adapta a su altura de vista principal de 10

El dibujable de fondo se adapta a su altura de vista padre de 100

parece funcionar con pequeños elementos de diseño de fondo, entonces solo necesitamos el script react-native init para inicializar proyectos utilizando este elemento de diseño de fondo de forma predeterminada. Agregaré los cambios explicativos anteriores a los archivos a continuación en una solicitud de extracción.

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

Muchas gracias. Fabrizio

fabriziobertoglio1987 en 20 jul. 2020

Enfrentando el mismo problema con RN 0.61.0 + nivel de API de Android 28.
Lo he reducido a una combinación de renderizados Flatlist, TextInput y Component anidado

asmi24886 en 20 jul. 2020

@ fabriziobertoglio1987 lo he intentado de esta manera, pero tal vez me perdí algo que no hice funcionar. Sé poco sobre Android y me alegro de que puedas solucionarlo. Aunque todavía estoy interesado en el tema de los accesorios clave.

sunnylqm en 20 jul. 2020

@ fabriziobertoglio1987 ¿Hay de todos modos en el código js nativo de reacción que pueda agregar para solucionar este problema rápidamente? Házmelo saber.

asmi24886 en 20 jul. 2020

@ asmi24886 puede encontrar un componente de prueba para reproducir de manera confiable este problema y una solución de código / configuración nativa en mi comentario aquí
No creo que haya una solución alternativa utilizando solo código JS.

glenn-axsy en 20 jul. 2020

Esta es la continuación de mi mensaje anterior https://github.com/facebook/react-native/issues/17530#issuecomment -660908150, mis esfuerzos por encontrar un trabajo independiente y escribir la solicitud de extracción para cerrar este problema.

Creé un elemento de diseño personalizado basado en 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>

El tiempo de ejecución se debe a la siguiente entrada, si elimino esta línea, una copia exacta del Drawable actual de react-native funciona y no activa el error de tiempo de ejecución. Incluí el ejemplo reproducible mínimo en mi 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"/>

Estoy escribiendo una solicitud de extracción, una vez que se haya fusionado la solicitud de extracción, podrá actualizar con el asistente de actualización .

La solicitud de extracción incluirá una reproducción de estos escenarios en la aplicación RNTester, cambios en la plantilla y la adición del elemento de diseño personalizado anterior para evitar este problema.

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

Este es un video que muestra el error de tiempo de ejecución cuando Drawable tiene la línea <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

Este es un video que muestra la solución (sin error de tiempo de ejecución) cuando Drawable no tiene la línea <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

Como se muestra en la siguiente captura de pantalla, solo estoy eliminando la siguiente línea del archivo xml dibujable
xml <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
No voy a cambiar de estilo. Drawable es el mismo que se usa en AppCompat y el estilo será el mismo, pero no activará el error de tiempo de ejecución.

Intentaré publicar la solicitud de extracción mañana .

fabriziobertoglio1987 en 20 jul. 2020

Muchas gracias sunnylqm por colaborar conmigo para escribir https://github.com/facebook/react-native/pull/29452 que resuelve este problema.

Parece haber un error en Drawable.mutate () en algunos dispositivos / versiones del sistema operativo Android incluso después de verificar el estado constante. Este error es difícil de reproducir y corregir, así que intente capturar la excepción para evitar fallas.

El problema es causado por esta línea en 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"/>

La línea anterior crea un StateListDrawable que cambiará la imagen de fondo TextInput (Background Drawable ) dependiendo del estado de TextInput .

state_pressed="false" y state_focused="false" activarán un cambio de TextInput BackgroundDrawable. Las imágenes no son la causa del problema, pero las incluí para fines de documentación.

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

Dentro de DrawableContainer.getChild () la variable ConstantState cs es null . Llamar a null.newDrawable(mSourceRes) desencadena una excepción de puntero nulo. Esta llamada es el resultado del cambio de estado del TextInput, en este seguimiento de pila después de presionarlo.

mDrawableFutures no incluye la lista correcta 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));

Más información en los comentarios 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

Muchas gracias
Te deseo un buen dia
Fabrizio

fabriziobertoglio1987 en 21 jul. 2020

❤15

@ fabriziobertoglio1987 Si el comentario anterior es una solución alternativa o una solución realmente implementable que debe agregarse para reaccionar de forma nativa, actualmente estamos en RN 0.59.3 y recibimos este error solo en el uso de producción. Parece que no podemos replicar en el desarrollo.

Coffeegerm en 24 jul. 2020

@Coffeegerm El comentario anterior https://github.com/facebook/react-native/issues/17530#issuecomment -662000718 es una breve explicación de cómo mi solicitud de extracción https://github.com/facebook/react-native/pull / 29452 corrige este problema. Una vez que la solicitud de extracción se fusiona en react-native

1) Las nuevas aplicaciones no tendrán este error
2) Las aplicaciones existentes se actualizarán y no experimentarán el error. Lea más sobre la actualización en la actualización # 3-upgrade-your-project-files para obtener más información sobre cómo aplicar los cambios en su carpeta /android cuando actualice su aplicación.

Si no desea actualizar, puede consultar mi PR https://github.com/facebook/react-native/pull/29452 y agregar esos cambios a su proyecto android carpeta. No es necesario realizar cambios en el código fuente react-native , ya que los cambios de configuración de este PR no están en la base de código Java /ReactAndroid , sino en la plantilla Android utilizada para inicializar el proyecto.

Actualmente estoy trabajando en otros problemas, pero volveré, responderé a cualquier comentario y realizaré las mejoras necesarias en mi Pull Request.

Por favor, regrese conmigo con cualquier sugerencia de mejora y comentarios.

te deseo un buen fin de semana
Muchas gracias por tu ayuda
Fabrizio

fabriziobertoglio1987 en 24 jul. 2020

👀7 👍3

Acabo de ver una confirmación que suena relacionada https://github.com/facebook/react-native/commit/1e4d8d902daca8e524ba67fc3c1f4b77698c4d08

estábamos generando estrictamente demasiadas operaciones Crear + Eliminar que eran redundantes y podrían causar problemas de coherencia, fallas o errores en plataformas que no manejan eso correctamente -
especialmente porque el orden de Crear + Eliminar no está garantizado (una vista reparental podría crearse "primero" y luego la diferencia podría emitir una "eliminación" para la misma vista).

@ fabriziobertoglio1987

sunnylqm en 17 ago. 2020

¿Alguna idea de cómo alguien podría solucionar este problema mientras usa Expo, por lo tanto, sin acceso a la carpeta de Android del proyecto? 😅

divonelnc en 17 ago. 2020

@divonelnc Hay una solución: use una clave nueva cada vez que se procese una entrada de texto, por ejemplo,

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

Y, por supuesto, puede causar otros problemas y pérdida de rendimiento.

sunnylqm en 18 ago. 2020

👎1

@sunnylqm Desafortunadamente, eso no ayudó 😞. Todavía lo tengo bloqueado aleatoriamente en la pantalla con docenas de entradas de texto.

divonelnc en 18 ago. 2020

¡Puedo confirmar este problema en Producción! Enfermera: 0,62,2 😕

abdulghanitech en 18 ago. 2020

👍7

El mismo problema ocurrió en RN 0.63.2 :(

Maddumage en 24 ago. 2020

👍2 👎1

Esta confirmación puede solucionar este problema:
https://github.com/facebook/react-native/commit/a5b5d1a805a9c54d325763b432be1cf2c8811dc9

hoanghungbk93 en 31 ago. 2020

👎2 🎉1 👍1

El mismo problema con Expo y RN sdk https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz

nachozullo en 29 sept. 2020

👍1

Vaya, esto fue frustrante. La solución @Hopding funciona. Lo sé porque pude reproducirlo todas las veces 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>

jordangrant en 1 oct. 2020

👍9 🎉4 👀3 ❤3

Aquí hay una solución bastante buena. Cree un contenedor para cualquier componente de entrada de texto que esté utilizando y genere una clave para él con useMemo. De esta manera, una sola entrada de texto siempre tendrá la misma clave a través de los renderizados, y tampoco tendrá que escribir claves para todas sus entradas de texto.

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

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

zholmes1 en 22 oct. 2020

👎1

Si está utilizando expo
Recibí este error después de actualizar de expo SDK 38 a 39.
Tuve que limpiar tanto mi caché de expo (expo -rc) + el caché de la aplicación móvil de expo (lo desinstalo y lo reinstalo para estar seguro) y el error desapareció.

dpnick en 7 nov. 2020

@dpnick, el error es muy difícil de reproducir. Sugiero usar el componente de prueba que publiqué aquí para asegurarse de que realmente se haya ido.

glenn-axsy en 9 nov. 2020

Recibiendo este error en producción y no puedo reproducir este problema, mi versión de RN es 0.62.2, aquí están mis registros de 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 en 9 nov. 2020

👍1

@AbdelkhalekESI el error es muy difícil de reproducir. ¿Has probado el componente de prueba que publiqué aquí ?

glenn-axsy en 10 nov. 2020

Escribí una solicitud de extracción que soluciona este problema https://github.com/facebook/react-native/issues/17530#issuecomment -663577143

Dirígete al pr https://github.com/facebook/react-native/pull/29452 sigue las instrucciones https://github.com/facebook/react-native/wiki/Building-from-source#publish - su-propia-versión-de-react-native y avíseme si necesita ayuda. Intentaré verificar este fin de semana si es necesario escribir un PR separado para Expo, pero creo que solo obtendrán la solución actualizando reactnative una vez que este PR se fusione y publique. Muchas gracias. te deseo buenas noches

más información en mis publicaciones anteriores https://github.com/facebook/react-native/issues/17530#issuecomment -662000718

fabriziobertoglio1987 en 10 nov. 2020

👍2

Mismo problema en la versión "react-native": "0.63.3"

nericode en 11 nov. 2020

👍7

simplemente borre su caché de Expo en la aplicación móvil (si usa la aplicación móvil) o el caché de la aplicación Expo en cualquier plataforma que use.

tzeneng96 en 13 nov. 2020

@ tzeneng96 ok, borrar el caché funciona con la aplicación, pero no es una solución aceptable, ¡porque el problema vuelve a ocurrir!

nericode en 13 nov. 2020

@AbdelkhalekESI el error es muy difícil de reproducir. ¿Has probado el componente de prueba que publiqué aquí ?

Pude reproducir este error usando este componente. También he recibido muchos registros de este bloqueo en producción. El proyecto actualmente ha reaccionado en la versión 0.63.3.

RenanGarcia en 13 nov. 2020

No sé si me equivoqué, pero en este tema citado por @ glenn-axsy, por lo que tengo entendido, lograron resolver agregando andoid \ app \ src \ main \ res \ values \ styles.xml el objeto:
"nombre del elemento =" android: editTextBackground "> @ android: color / transparent / item"

Todavía estoy probando la solución.

thiagocristianno en 14 nov. 2020

@thiagocristianno, tu comprensión es correcta, aunque no es una solución perfecta y creo que no ayuda a los desarrolladores de la Expo, ya que no pueden controlar esa configuración.

glenn-axsy en 16 nov. 2020

Vaya, esto fue frustrante. La solución @Hopding funciona. Lo sé porque pude reproducirlo todas las veces 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 , ¿dónde vio la solución?

bobowinca en 18 nov. 2020

Vaya, esto fue frustrante. La solución @Hopding funciona. Lo sé porque pude reproducirlo todas las veces 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 , ¿dónde vio la solución?

@bobowinca Este es un hilo extremadamente largo y esa solución funcionó al 100% para mí. RN 63.3 no Expo

Screen Shot 2020-11-18 at 1 18 45 PM

jordangrant en 18 nov. 2020

👍1

@jordangrant , Doh! Mire siempre antes de preguntar. He fallado. Gracias Señor.

También parece que pudiste reproducir el problema de manera consistente. Me pregunto cómo lo hace. Solo he visto rastros de pila hasta ahora. Estoy averiguando formas de verificar la solución.

bobowinca en 18 nov. 2020

@bobowinca, el componente de prueba que aquí debería ayudarlo a reproducirlo de manera consistente.

glenn-axsy en 19 nov. 2020

❤1

@bobowinca, el componente de prueba que aquí debería ayudarlo a reproducirlo de manera consistente.

¡Funciona de maravilla! ¡Gracias Glenn!

bobowinca en 19 nov. 2020

👍2

¡Agregar <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> a styles.xml está funcionando!
El método para agregar a key={Math.random().string()} TextInput estaba funcionando, pero los reinterpretes hacen que el teclado se oculte cada vez tras un segundo; era inaceptable.

Zummek en 1 dic. 2020

👍1

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

¿Es este un informe de error?

¿Ha leído las Pautas de contribución ?

Medio ambiente

Comentario más útil

Especificaciones y versiones

Que causa el accidente

Fuente del problema

Como lo arreglamos

Todos 294 comentarios

Especificaciones y versiones

Que causa el accidente

Fuente del problema

Como lo arreglamos

Especificaciones y versiones

Que causa el accidente

Fuente del problema

Como lo arreglamos

Especificaciones y versiones

Que causa el accidente

Fuente del problema

Como lo arreglamos

Crashlytics:

Especificaciones y versiones

Que causa el accidente

Fuente del problema

Como lo arreglamos

¿Es este un informe de error?

¿Ha leído las Pautas de contribución ?

Medio ambiente

¿Es este un informe de error?

¿Ha leído las Pautas de contribución ?

Medio ambiente

¿Es este un informe de error?

¿Ha leído las Pautas de contribución ?

Medio ambiente

Temas relacionados