React-native: NullPointerException: إغراء استدعاء الطريقة الافتراضية "android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)"

تواجه نفس المشكلة.

كذلك هنا [email protected]

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

المشكلة نفسها

المشكلة نفسها. نفس السجل

كذلك هنا على RN 44.0

+1 anotha واحد

قام الرجال بإعادة تشغيل الحزم ومسح ذاكرة التخزين المؤقت لي!

نفس المشكلة بالنسبة لي. أنا أستخدم RN 0.51.0 والتفاعل - أصلي - مادة - textfield 0.12.0.

أنا أواجه هذه القضايا أيضًا. الغريب أنه من الصعب جدًا تتبع الخطأ لأن تتبع المكدس لا يحتوي على أي معلومات مفيدة. حتى أنني لا أعرف أين يمكن أن يكون الخطأ.
سيتم التحديث هنا إذا وجدت الحل

يحدث نفس الخطأ على RN 0.52.0.

شكرا لنشر هذه! يبدو أنك ربما لا تستخدم أحدث إصدار من React Native ، v0.53.0 ، الذي تم إصداره في يناير 2018. هل يمكنك التأكد من استمرار إمكانية تكرار هذه المشكلة في أحدث إصدار؟

سأغلق هذا ، ولكن لا تتردد في فتح إصدار جديد إذا كنت قادرًا على تأكيد أن هذه لا تزال مشكلة في الإصدار 0.53.0 أو أحدث.

_{كيفية المساهمة • ما يمكن توقعه من القائمين على الصيانة}

نفس المشكلة في 0.53.3

المشكلة نفسها

@ رد فعل - أصلية - بوت تحتاج إلى إعادة فتح المشكلة

تواجه نفس المشكلة مع Android 8

كذلك هنا. رد فعل أصلي 0.53.3 ، SM-T550 ، مستوى API 25 (Android 7.0)

ظهرت هذه المشكلة معي ، React الأصلي 0.53.3 - Android 8.1.

رد فعل أصلي 0.53.3 ، أندرويد 8 ، نفس المشكلة

نفس المشكلة ، رد الفعل الأصلي 0.53.0 و android 8. إنه سبب غريب يبدو أن هذا الخطأ يظهر بشكل عشوائي. لا يمكنني العثور على أي خطوات دقيقة لإعادة إنتاجه.

لديك تطبيق إنتاج يعمل بنظام RN 0.54.2 ويبدو أن هذا يؤثر على عدد قليل من المستخدمين الذين يستخدمون Android 8.0.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(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 هل يمكننا إعادة فتح هذه المشكلة؟

نفس المشكلة هنا android 8.0 api 26

نفس الشيء في 0.54.2.

لقد قمت بتضييقه إلى <TextInput> يتم عرضه داخل FlatList. عندما استبدل هذا بـ <Text> ، تختفي المشكلة.

الرجاء إعادة الإنتاج بأحدث إصدار متوفر الآن وسأعيد فتح هذا.

كذلك هنا @ radko93

Android 8.1 API 27

"التبعيات": {
"رد فعل": "16.3.1"،
"تفاعل أصلي": "0.55.1"،
"تفاعل-أصلي-خطي-متدرج": "^ 2.4.0"،
"تفاعل-أصلية-متجه-رموز": "^ 4.6.0"،
"رد فعل التنقل": "^ 1.5.11"
} ،

محاولة استدعاء الأسلوب الافتراضي "android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)" على مرجع كائن فارغ
خلق كل المستقبل
حاوية قابلة للسحب. جافا: 875
getOpacity
حاوية قابلة للسحب. جافا: 1158
getOpacity
حاوية قابلة للسحب. جافا: 433
getOpacity
InsetDrawable. جافا: 258
computeOpaqueFlags
رأي. جافا: 15698
setBackgroundDrawable
رأي. جافا: 20502
تعيين الخلفية
رأي. جافا: 20395

رأي. جافا: 5238

عرض النص. جافا: 826

تحرير النص. جافا: 88

تحرير النص. جافا: 84

تحرير النص. جافا: 80

تحرير النص. جافا: 76
setThemedContext
ReactTextInputShadowNode. جافا: 80
إنشاء عرض
UII التنفيذ. جافا: 282
إنشاء عرض
UIManagerModule. جافا: 366
يستحضر
طريقة. جافا
يستحضر
JavaMethodWrapper. جافا: 372
يستحضر
JavaModuleWrapper. جافا: 160
يركض
NativeRunnable.java
مقبض
معالج. جافا: 790
إرسال رسالة
معالج. جافا: 99
إرسال رسالة
MessageQueueThreadHandler. جافا: 29
عقدة
وبير. جافا: 164
يركض
MessageQueueThreadImpl. جافا: 192
يركض
مسلك. جافا: 764

المشكلة نفسها

package.json
"التبعيات": {
"رد فعل": "16.3.1"،
"تفاعل أصلي": "0.55.2"،
} ،

بناء
الإصدار 26
buildToolsVersion "26.0.2"
الإصدار 16

المشكلة نفسها.

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)

أندرويد: 7.1.1
رد الفعل الأصلي ： 0.48.3

المشكلة نفسها.

نفس المشكلة ، في بيئة الإنتاج ، جهازي هو HUAWEI (LLD-AL10) 8.0.0 ، وأنا أستخدم حاليًا React Native 0.46.2 ، شكرًا

الحصول على نفس المشكلة عند استخدام أحدث إصدار من رد الفعل الأصلي (0.55.3). يبدو أن المشكلة مرتبطة بإدخال النص في قائمة مسطحة كما هو مذكور أعلاه. الحصول على الخطأ في Android 8.0 و 8.1. أي حلول لتجنب هذه المشكلة؟

يمكنني إعادة إنتاج هذا الخطأ عن طريق إنشاء مشروع React Native جديد باستخدام init-native وتغيير App.js إلى

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

كنت أقوم بتشغيل هذا على Galaxy S8 مع Android 8.0.0 من MacOS 10.13.3.

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

لا أعرف ما إذا كان الخطأ غير مرتبط بشكل مباشر بعدد إدخالات النص ، ولكن هذه هي الطريقة الوحيدة التي يمكنني بها إعادة إنتاج هذا الخطأ بطريقة موثوقة إلى حد ما. مع 128 إدخالًا ، لم أحصل على هذا الخطأ عند كل إعادة تشغيل ، ولكن بعد إعادة تحميل قليلة ، حدث ذلك. في 256 إدخال نصي عارية لا أعتقد أنني تمكنت من بدء التطبيق دون الحصول على الخطأ. لاحظت أيضًا أن إضافة عناصر بين مدخلات النص يبدو أنها تقلل من احتمالية حدوث هذا الخطأ ، لذلك من المحتمل ألا تكون مرتبطة بشكل مباشر بعدد إدخالات النص. لقد جربت ذلك في تطبيقي الحالي وأضفت المئات من مدخلات النص إلى شاشة البداية أدت أيضًا إلى حدوث هذا الخطأ ، ولكن لا يبدو أن طرق العرض الأخرى التي لدي مع كميات مماثلة من مدخلات النص المغلفة في عناصر أخرى تؤدي إلى حدوث هذا الخطأ دائمًا كما يوجد في تطبيقي .

لدي نفس المشكلة. كنت أقوم بتشغيل هذا على Huawei P10 مع Android 8.0.0.
"react": "^16.2.0", "react-native": "^0.55.0",
لقطة شاشة

يبدو أن المشكلة تكمن في إدخال النص. يحدث هذا على جهاز Huawei P10 (Android 8.0.0). هل يوجد حل لهذا بالفعل؟

أندرويد: 7.1.1
"تفاعل أصلي": "0.53.3"،

شكرا لنشر هذه! يبدو أن مشكلتك قد تشير إلى إصدار قديم من React Native. هل يمكنك إعادة إظهار المشكلة في

شكرا لمساهماتكم.

أواجه نفس المشكلة. إنه مرتبط بمكون إدخال النص. حتى إدخال نص واحد يتم تقديمه على الشاشة يسبب هذا الخطأ. هل يوجد اى اعمال فى الجوار؟

رد الفعل الأصلي: 0.55
رد فعل: 16.3.1

لقد غيرت مُنشئ ReactEditText "super" ، ويبدو أنه لم يحدث ،
لكن ضع تعليقًا خارج "underlineColorAndroid"
https://github.com/yuanboGeng/react-native/commit/36f7949f9a3e9c1f3b10df43a9f495f9f8712a1f
رد الفعل الأصلي: 0.53.3
رد فعل: 16.2.0

بدأ هذا يحدث بالنسبة لي بعد ترقية المحاكي الخاص بي إلى المستوى 26 من API من المستوى 21

لقد ظهر هذا الخطأ بدون سبب أثناء التطوير. قمت بتنظيف مجلداتي / الإصدار وقمت بتشغيل run-android مرة أخرى. اختفت القضية. غريب حقا. آمل أن يحل البناء النظيف هذا الأمر لبعضكم.

تواجه نفس المشكلة. اختلاف بسيط واحد - في خاصتي ، أقوم بتداخل إدخال النص داخل قائمة افتراضية (والد قائمة FlatList) ولا أحصل على المشكلة إلا عندما أبدأ بالتمرير في تلك القائمة ، حتى بعد ذلك فقط أحصل عليها بشكل متقطع وليس طوال الوقت. على غرار الآخرين ، يحدث هذا في بيئة إنتاج ، لذا فإن إعادة تشغيل الحزم ليس خيارًا.

بناءً على بعض عمليات البحث ، يظهر مرتبط بمشكلة قديمة في Android نفسه: https://issuetracker.google.com/issues/37068452
إذا كانت هذه هي المشكلة الأساسية ، فسيتم حل هذه المشكلة بمجرد ترقية compileSdk ودعم إصدارات المكتبة في مشروع RN. لا توجد فكرة عن LoE على ذلك ، رغم ذلك.

تحديث: محاولة إجبار المشاريع الفرعية على استخدام إصدار أعلى من أدوات البناء ولم تحل compileSdk هذه المشكلة لمشروعي ، كما هو موضح في منشور SO هذا . لست متأكدًا مما إذا كنت قد قمت بتطبيق هذه الإصدارات الأعلى للتو بشكل خاطئ ، أو إذا كان إعداد البناء الخاص بي لا يتعامل مع RN كمشروع فرعي بهذه الطريقة ، أو إذا لم يكن في الواقع حلاً صالحًا للمشكلة هنا.

تحرير 2: يبدو أن ReactEditText لا يستخدم حتى إصدار مكتبة الدعم من EditText (والذي سيكون AppCompatEditText) ، وهو ما يفسر سبب عدم قيام ترقية مكتبة الدعم بأي شيء. أنا أبحث في هذا - سيستغرق الأمر بضعة تحديثات أكثر من مجرد تغيير الميراث لجعل هذا يعمل ، ولكنه _ قد يكون الحل الصحيح لهذه المشكلة.

تحرير 3: لم يكن الحل. لم أعد واثقًا من أن هذه المشكلة هي نفس مشكلة AOSP المرتبطة.
أستطيع أن أقول أنه لا يبدو أنه يهم نوع ScrollView الذي وضعت فيه النص - لقد تمكنت من التكاثر في كل من VirtualizedList و ScrollView ، وقد قام الكثيرون في هذا الموضوع باستخدام FlatList.

لدي نفس هذا على الإنتاج

أنا أيضا أواجه هذه المشكلة. تشغيل cd android ; ./gradlew clean ; cd .. ; react-native run-android يعمل بالنسبة لي كما أشار mbret (شكرًا!)

رائع ، ولكن ماذا عن التطبيقات في الإنتاج مع عملاء حقيقيين؟ : |

آسف @ ahanusek ، أنا لا أقول أن هذا يحل المشكلة ، أنا فقط أقول أنه في التطوير

ولكن حتى بالنسبة للتنمية ، فهو ليس حلاً. حسنًا ، إذا قمت بتنظيف جهازك ، فابدأ تشغيل التطبيق مرة أخرى ، ولكن إذا كنت تستخدم المدخلات "بالكاد" ، فلا يزال من الممكن أن تحصل على هذا الخطأ مرة أخرى.

ahanusek نعم ، أنا أتفق معك ، ولا

نرى هذا أيضًا ، الإصدار 0.55.4:

متأكد تمامًا من أنه ليس لدي TextField في FlatList أو VirtualizedList ، fwiw. هذا يحدث في بناء الإنتاج لدينا.

رؤية هذه المشكلة في v0.55.4 . ونعم نحن نستخدم TextInput في قائمة.

يحدث في رد الفعل 0.55. التالية

يحدث أيضًا في التفاعل الأصلي 0.55 ، باستخدام الإدخال في القائمة المسطحة.

إنشاء منشور فعلي هنا في حالة عدم رؤية الأشخاص لتعليقي المعدل:

أستطيع أن أقول أنه لا يبدو أنه يهم نوع ScrollView الذي وضعت فيه النص - لقد تمكنت من التكاثر في كل من VirtualizedList و ScrollView ، وقد قام الكثيرون في هذا الموضوع باستخدام FlatList.
أو بعبارة أخرى ، تتلخص المشكلة في ذلك
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

المشكلة نفسها

أنا أيضا أواجه نفس المشكلة.

الغريب في الأمر ، أن هذا لم يبدأ في الحدوث لي حتى الليلة الماضية ، وكنت أقوم بتقديم TextInputs بنفس الطريقة لأكثر من شهر الآن قيد التطوير.

الإصدار 9 من نظام التشغيل Android
رد فعل "16.3.1"
رد فعل أصلي "~ 0.55.2"

لقد واجهنا أيضًا مشكلة مماثلة في التعليمات البرمجية الخاصة بنا

سجلات الأعطال:
استثناء فادح: java.lang.NullPointerException: محاولة استدعاء طريقة افتراضية 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
في android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
في android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
على android.view.View.computeOpaqueFlags (View.java:16791)
في android.view.View.setBackgroundDrawable (View.java:21710)
على android.view.View.setBackground (View.java:21603)
في android.view.View.(مشاهدة. java:5547)
في android.widget.TextView.(TextView.java:1135)
في android.widget.EditText.(EditText.java:107)
في android.widget.EditText.(EditText.java:103)
في android.widget.EditText.(EditText.java:99)
في android.widget.EditText.(EditText.java:95)
على com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:92)

ما هي المشكلة هنا؟
حاولت بعض التحقيقات:
- أكثر من 1000 عمل تحرير نصي في تطبيق android خالص
- فشل حوالي 200 ReactTextInput كما هو محدد هنا

• كشفت بعض التحليلات الخاصة بالمسألة عن سيناريو متعدد خواص غريب ينفصل عن SparseArray
  - لا يعتبر SparseArray آمنًا للخيط وفي نفس الوقت يوجد منطق gc () بداخله
  - يتم استخدام SparseArray لـ DrawableContainerState وقد يتم إنشاء DrawableContainerState الجديد باستخدام العقود الآجلة القابلة للرسم للحالة الثابتة الحالية (هذا هو SparseArray) عن طريق الاستنساخ
  - ما ورد أعلاه هو وصفة لاستثناء nullpointer متعدد الخيوط ويحدث على النحو التالي
  - مؤشر ترابط الوحدة النمطية الأصلي يعمل على إنشاء عقدة الظل الخاصة بـ React Edit Text ودورة حياته تقوم بعمل EditText جديد (رد الفعل في سياق النص) والذي ينتج عنه بدوره إمكانية رسم الخلفية ليتم تعيينه وأخيراً استدعاء رمز مؤشر ترابط SparseArray غير الآمن
  - يمكن استخدام مؤشر ترابط واجهة المستخدم في الوقت نفسه لإنشاء عرض EditText لبعض RTI الأخرى في نفس الوقت مما يؤدي إلى نفس رمز مؤشر ترابط SparseArray غير الآمن
  - يحدث استثناء Nullpointer عندما يتم استدعاء gc () ويتم استنساخه في نفس الوقت (يحدث هذا الاستنساخ داخليًا في Drawable * class) لنفس الكائن مما يؤدي إلى ظهور كائن gc-ed جزئيًا. تمت إزالة شيء مثل عنصر من مصفوفة القيم وإزالته فارغًا ، لكن لم يتم تحديث علامة noOfItems بعد ، لذلك يحتوي الكائن المستنسخ على عنصر واحد أقل من المحدد في علامة noOfItems ويمكن أن يتسبب التكرار في استثناء مؤشر فارغ للفهرس المحذوف.

كيف قمنا بحلها أو جعلناها تعمل؟
[1] انقل استدعاء EditText (سياق) جديد على مؤشر ترابط واجهة المستخدم أيضًا وقم بقياس ShadowNode غير المتزامن ولكن في انتظار حتى يتم إنشاء كائن EditText هذا على مؤشر ترابط واجهة المستخدم - أعاد كتابة مجموعة عقدة الظل بشكل أساسي
أوجه القصور: تبديل الخيط لكل RTI

[2] قم بإنشاء EditText باستخدام مخطط inflater على الوحدة النمطية Native مع تحديد قيمة فارغة للخلفية وإنشاء مرة واحدة فقط للخلفية يمكن رسمها عن طريق إنشاء EditText على مؤشر ترابط واجهة المستخدم وتخزين الخلفية الخاصة بها للرسم على مستوى shadowNode. يتم استخدام هذا الرسم القابل للرسم لتعيين خلفية نصوص dummyEditText التي تم إنشاؤها باستخدام تخطيط inflater للحصول على المقياس الذي يعتبر حشوات خط الحدود القابلة للرسم. في هذه الحالة ، يحتاج المقياس إلى الانتظار مرة واحدة فقط لإنشاء Drawable

لقد اختبرت كلاهما وهما يعملان بشكل جيد لـ 1024 ReactTextInput.

ملاحظة: استنادًا إلى التحقيق ، لا يبدو أن هذا هو الحل الأكثر أناقة حقًا ولكنه يعمل مع الحد الأدنى من التغييرات ويثبت تحليل المشكلة.

الاقتراحات والانتقادات موضع ترحيب كبير!

كود عقدة الظل:

`الحزمة.richtextinput؛
استيراد android.content.Context ؛
استيراد android.graphics.drawable.Drawable ؛
استيراد android.os.Build ؛
استيراد android.text.Layout ؛
استيراد android.view.LayoutInflater ؛
استيراد android.view.ViewGroup ؛
استيراد android.widget.EditText ؛
استيراد com.facebook.infer.annotation.Assertions ؛
استيراد com.facebook.react.bridge.JSApplicationIllegalArgumentException ؛
استيراد com.facebook.react.common.annotations.VisibleForTesting ؛
استيراد com.facebook.react.uimanager.Spacing ؛
استيراد com.facebook.react.uimanager.ThemedReactContext ؛
استيراد com.facebook.react.uimanager.UIViewOperationQueue ؛
استيراد com.facebook.react.uimanager.annotations.ReactProp ؛
استيراد com.facebook.react.views.text.ReactBaseTextShadowNode ؛
استيراد com.facebook.react.views.text.ReactTextUpdate ؛
استيراد com.facebook.react.views.textinput.ReactTextInputLocalData ؛
استيراد com.facebook.react.views.view.MeasureUtil ؛
استيراد com.facebook.yoga.YogaMeasureFunction ؛
استيراد com.facebook.yoga.YogaMeasureMode ؛
استيراد com.facebook.yoga.YogaMeasureOutput ؛
استيراد com.facebook.yoga.YogaNode ؛
استيراد.R ؛

استيراد javax.annotation.nullable ؛
// ملاحظة: هذه الفئة لا تختلف كثيرًا عن ReactTextInputShadowNode التي تتوقعها في آلية
// تحديد سياق الموضوع وإجراء القياس
الطبقة العامة ReactTextInputShadowNode توسع ReactBaseTextShadowNode تنفذ YogaMeasureFunction
{
تضمين التغريدة
السلسلة النهائية العامة الثابتة PROP_TEXT = "text" ؛
رسم ثابت خاص sDummyEditTextBackgroundDrawable = فارغ ؛

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

} `

ملف نصي لتحرير النص الوهمي

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

sayantanbugs هل لديك جزء من التعليمات البرمجية لهذا الحل؟ شكر!

تم تحديث تعليقي الأخير ليشمل كود ShadowNode والتخطيط المستخدم لتضخيم النص الوهمي

sayantanbugs - هذا عمل رائع 🕵️! سنحاول ذلك في مشروعنا ونقدم تقريرًا! شكر!

المشكلة نفسها
رد الفعل الأصلي: 0.55.4
أندرويد: 8.0

sayantanbugs هل يمكنك من فضلك توفير فرق / التصحيح؟

المشكلة نفسها. تم الإبلاغ عنها عبر Crashlytics دون الكثير من التفاصيل الأخرى ، لذلك من الصعب جدًا استكشاف الأخطاء وإصلاحها.

RN 55.3
أندرويد 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)

هذا هو السبب الرئيسي لتعطل تطبيقنا في الإنتاج. متى / كيف يمكن أن يحدث هذا؟

نفس الشيء هنا في بناء الإنتاج.
يحدث عند تحرير النص. انها عشوائية.

رد فعل: 16.3.0
رد فعل - أصلي: 0.54.4
نفس المشكلة ، كيف تصلحها؟

^ ^ ^ يجب على المزيد من الأشخاص محاولة حل المشكلة باستخدام حل ReactTextInputShadowNode.java ملف في حياتك react-native مجلد ومبادلة خارج رمز قدم هو منصبه. يمكن أن تتفاجأ بسرور.

بعد أسبوع من القيام بذلك ، يسعدني أن أبلغكم أن الخطأ قد حدث مرة أخرى فقط. ولكن هذه المرة كان الأمر مختلفًا .. لقد تمكنت من إعادة تشغيل التطبيق وجعله يعمل بشكل طبيعي دون الحاجة إلى إعادة تثبيت التطبيق عبر react-native run-android والذي كان حقًا بمثابة ألم لأنني قبل ذلك كنت أفقد حقًا الوصول إلى شاشتين قدمت تلك المدخلات النصية. سأستمر في تدوين الخطأ إذا ظهر مرة أخرى ولكن حتى الآن أعتقد أنه يعمل بالقرب من نهايتي تمامًا. تصحيح أخطاء ممتاز ،sayantanbugs!

@ Friendly-Robot imo ليس حلاً. إنه حل بديل في أحسن الأحوال. يحدث هذا في كود الإنتاج حيث لا يمكننا فقط تصحيح حل لم يتم اختباره حتى أنك تعترف بأنه لا يصلحه.

إذا كان الأمر مزعجًا على dev ، بالتأكيد ، بكل الوسائل. لكنني لا أعتقد أنه من الحكمة تحفيز الناس على استخدامه كحل. ربما كأساس للعلاقات العامة رغم ذلك.

تم الاتفاق مع @ Friendly-Robot (ومع ذلك ، شكرًا لك sayantanbugs ). أي شخص من RN هنا؟ هل تعتقد أن التصحيح يمكن أن يصل إلى RN repo ويتم اختباره؟

حسنًا ، تمكنت أخيرًا من اختبار نهج sayantanbugs ، ولكن لا يبدو أنه يعمل معي (يعتمد أيضًا على رمز غير رئيسي). ومع ذلك ، كحل مؤقت (مقابل حل إطار عمل) ، يمكنك تقديم نسختك الخاصة من ReactEditText باستخدام طريقة drawableStateChanged() مصححة:

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

هذا حرفيا مجرد تصحيح ، ولكن على الأقل لن يتعطل التطبيق. لا يزال إدخال النص مستجيبًا ويعمل كما هو متوقع ، بقدر ما أستطيع أن أقول.

عند إعادة إنتاج العطل (الذي تم إصلاحه الآن) ، استطعت أن أرى أن هذا الاستثناء الفعلي حدث عدة مرات في تتابع سريع.

تعديل:
هممم ... بينما يبدو أن كل شيء يعمل ، يبدو أن حالة Drawable قد تعرضت للتلف بشكل دائم. حتى بعد إنشاء عرض جديد تمامًا باستخدام إدخالات نصية جديدة ، فإن لمس أي إدخال نصي سيؤدي إلى ظهور الرسالة مرة أخرى. لحسن الحظ ، يظهر فقط عند النقر فوق الإدخال وليس عند إدخال النص.

لقد كنت ألعب مع وجهة نظري والانتقال الليلة ، لقد تلقيت هذا الخطأ مثل عشرين مرة ... لم أكن أفعل أي شيء سوى النقر على تنقلاتي لاختبار الانتقالات بين طرق العرض. أعتقد أن هذه مشكلة كبيرة: /

شكرًا @ Friendly-Robot على اختبار الحل!

أوافق على معظم الآراء حول أن الحل الخاص بي هو تصحيح وقد ذكرت ذلك في رسالتي الأصلية التي تتضمن الحل. السبب في أنه لا يزال من الممكن استخدامه في مشروعي هو أننا أنشأنا RTI أكثر ثراءً بالميزات من جانبنا لتوسيع RN RTI. ومن ثم يمكننا استخدام الحل الخاص بي في تنفيذ ShadowNode لـ RTI المخصص الخاص بي. في مشروعنا ، نحتفظ بنسخة معدلة من RN لإصلاح العديد من أخطاء RN / حالات الاستخدام ، وبالتالي يمكننا أيضًا إدخال هذه التغييرات في ذلك.

أخطط لإلقاء نظرة ثانية على الاحتمالات الأخرى حيث كان عليّ حل المشكلة الملتهبة التي نحن بصددها في غضون أيام قليلة خلال تلك الفترة.

شكرا جميعا لردودكم!

davidmontemayor ، إذا تم ملاحظة مشكلة الحالة
هذا يجعلنا نعتقد أننا قد نعيد كتابة ShadowNode بأنفسنا بحيث لا نحتاج إلى كائن EditText بالطريقة التي يتم استخدامه بها في هذه المرحلة بخلاف استخدام وظيفة القياس.

يحدث لي أيضا. أنا أستخدم ScrollView.
لدي عناصر تحكم مختلفة (راديو ، قائمة ، تحرير ، إلخ) في عرض التمرير. أود أن أقول إن لدي 10 عناصر تحكم كحد أقصى ، لذا ليست قائمة ضخمة.
من الصعب التكاثر رغم ذلك. يبدو أنه يحدث في أوقات عشوائية ، لكنني أعتقد أنني أتعقبه لإحضار التطبيق إلى المقدمة من الخلفية عندما يكون لدي ScrollView على الشاشة (مع وجود عناصر تحكم في تحرير النص).
غير متأكد بنسبة 100٪ بالرغم من ذلك
أتساءل عما إذا كان الأمر متعلقًا بإصدار دعم Android lib.

تعال على فيسبوك ، أصلح هذا الخطأ.
من الصعب إنشاء تطبيقات ذات جودة إنتاجية عندما يكون لدينا أعطال عشوائية كهذه.

com.facebook.react.views.textinput.ReactEditText
RN 0.54
Android SDK 27
الهاتف 8.1

وجود هذه المشكلة أيضًا ، باستخدام ScrollViews أيضًا. davidmontemayor ، هل يمكنك توجيه RN الجديد الخاص به إلى الملف الذي قمت بتحريره بواسطة بنية الدليل؟ لدي تطبيق في السوق يؤثر عليه الانهيار بشكل مزعج وكان يأمل في اكتشاف الخطأ كما فعلت حتى يحدث الإصلاح. هل لديك مثال على الملف الذي استخدمته؟

نفسه:

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

Squidski - لسوء الحظ ، يصبح إصلاح "catch 'em all" صعبًا للغاية بمجرد أن تبدأ في التعامل مع فشل التهيئة EditText . للخلفية ، هناك طريقتان مختلفتان تظهران هذه المشكلة:

• عندما يتم إنشاء ReactEditText ( android.widget.EditText.<init>(EditText.java:95) )
• عند تفاعل ReactEditText مع ( android.widget.TextView.onTouchEvent(TextView.java:8467) )

الشيء الأساسي هو استبدال العرض الذي تم إنشاؤه بـ ReactTextInputShadowNode . بدلاً من تركها تفعل new EditText(getThemedContext()) ، أنشئ فصلك الخاص الذي يمتد من EditText . يمكنك بعد ذلك اكتشاف الاستثناء الناتج عن المسار الثاني في drawableStateChanged() .

الجزء الأصعب هو إصلاح أخطاء التهيئة. لذلك تحتاج إلى إنشاء فئة "غلاف قابل للرسم" يمكن استخدامها لتغليف أي قابل للرسم يتم تمريره إلى EditText.setBackground() . يجب أن يلتقط هذا الغلاف بعد ذلك الاستثناءات التي يتم إلقاؤها من المفوض.

لا تزال هذه المشكلة تحدث بشكل عشوائي مع تطبيقي مع أحدث إصدار من React Native + أحدث JSC + التدرج اعتبارًا من 25 يوليو 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

لقد بدأت في رؤية هذه المشكلة مع Android 8.0.0 ومع RN 0.55.3. هل لديهم أي حلول لهذا أو العلاقات العامة ربما؟

تواجه نفس المشكلة بشكل عشوائي أيضًا مع FlatList of TextInputs 😞

• رد الفعل الأصلي: 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

بناءً على القراءة وتصحيح الأخطاء ، قررت أن أجرب ما يلي في نهاية هذا الأسبوع ...

1. قم بإزالة جميع مكالمات underlineColorAndroid من التعليمات البرمجية الخاصة بي (أنا أستخدم عناصر التفاعل الأصلية 0.19)

   • يجب أن يتراجع التطبيق إلى استخدام شفاف لعناصر تحكم EditText
   • حاول أيضًا إجبارها على الشفافية

2. قم بتحديث أنماط Android الخاصة بي لتتبعها. سيؤدي هذا إلى فرض خلفية شفافة على كافة عناصر تحكم EditText

<resources>

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

    </style>

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

</resources>

1. اختبار - اختبار - اختبار. المشكلة صعبة التكاثر. على الرغم من أن أحد العملاء عثر عليها هذا الصباح.

2. كبديل ، قم بتنفيذ الإصلاح منsayantanbugs
   4.1 تحديث عناصر رد الفعل الأصلي إلى الإصدار التجريبي 1.0xx

قراءة٪ s
https://issuetracker.google.com/issues/37068452
https://github.com/facebook/react-native/issues/18214

RN 0.54
تفاعل العناصر الأصلية 0.19

يحدث على RN 0.56.0 Android 8.1.0
أتساءل عما إذا كانت هناك خطط للمضي قدمًا.

حاول استبدال جميع حالات
underlineColorAndroid={"transparent"}
مع
underlineColorAndroid={"#00000000"}

وجود هذه المشكلة. يمكنك حلها بشيء صعب. قم بعمل زر يتعامل مع عرض الإدخال الحالي. لذلك لدينا FlatList من الأزرار و TextInput فقط نقوم بتحريره الآن. بدون المرجع ، نحتاج إلى النقر المزدوج لبدء تحرير الإدخال

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

WilliamAlexanderpaulroy هل نجح الحل الخاص بك؟

xstreamcl الحل الذي نشرته يعمل حتى الآن. أكثر من أسبوعين ولم أشاهد المشكلة.
يحتاج إلى مزيد من الاختبار بالرغم من ذلك ؛)

تسببت هذه المشكلة في تعطل تطبيقنا في الإنتاج أيضًا. إنها حشرة سيئة ، لأنه من الصعب حقًا التكاثر. لقد وجدنا إصلاحًا واعدًا لتطبيقنا ، وأود مشاركة النتائج التي توصلنا إليها هنا لأتمنى توفير بعض الوقت والإحباط للآخرين.

المواصفات والإصدارات

تسبب هذا الخطأ في تعطل تطبيقنا على أجهزة Samsung و Google و LG Android. لدينا تقارير أعطال من إصدارات Android التالية:

• 8.0.0
• 8.1.0
• 7.1.1

تطبيقنا قيد التشغيل:

• react-native : 0.53.0
• react : 16.2.0

ما الذي يسبب الانهيار

كما لاحظ الآخرون في سلسلة الرسائل هذه ، يبدو أن المشكلة قد نشأت عن طريق عرض مزيج من مكونات TextInput و FlatList و ScrollView . في حالتنا ، لدينا شاشة تحتوي على TextInput معروض فوق FlatList . عند النقر على أحد العناصر الموجودة في FlatList ، ينتقل التطبيق إلى شاشة جديدة تحتوي على نموذج. المكون الجذر لهذا النموذج هو ScrollView يحتوي على عدد من مكونات TextInput (مع بعض الأزرار والمكونات المخصصة الأخرى). يتعطل تطبيقنا عندما ينقر المستخدم على أحد هذه العناصر FlatList (لاحظ أنه لا يحدث _ في كل مرة).

إعادة إنتاج هذه المشكلة أمر صعب. في الواقع ، لم نتمكن من القيام بذلك. لكننا نعلم أن التعطل يحدث في هذه المرحلة من سير العمل من خلال مشاهدة تسجيلات جلسة Appsee الخاصة بنا.

نظرًا لأنه لا يمكننا إعادة إظهار المشكلة ، فقد اضطررنا إلى الاعتماد على سجلات الأعطال من Appsee لتصحيحها. لقد قمت بنسخ تتبع المكدس من تقارير الأعطال أدناه (وحذفت بعض الأقسام المزعجة). إنها متطابقة إلى حد ما مع آثار المكدس التي تم نشرها في سلسلة الرسائل هذه من قبل الآخرين:

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)

مصدر المشكلة

بعد قراءة سلسلة الرسائل هذه وإجراء بضع ساعات أو البحث ، وجدت معالج prop underlineColorAndroid في الملف 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);
  }
}

يحتوي تقرير الخطأ المرتبط في التعليق على تتبع المكدس التالي:

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)

يتطابق هذا مع تتبع المكدس الذي نواجهه في تطبيقنا. لا أتظاهر بفهم المشكلة الأساسية تمامًا ، ولكن يبدو من المحتمل أن سبب تعطل تطبيقنا في الإنتاج يرجع إلى خطأ Drawable.mutate() الذي تم تشغيله. هذا يحدث عندما نحاول تعيين underlineColorAndroid دعامة على موقعنا TextInput العنصر (وبالتالي استدعاء ReactTextInputManager.setUnderlineColor طريقة).

كان تطبيقنا يعرض TextInput مع العناصر التالية ، أحدها كان 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"
/>

كيف أصلحناه

لقد احتجنا إلى تعيين هذه الخاصية لإزالة التسطير من مكونات TextInput في تطبيقنا. ولكن بناءً على النتائج التي توصلنا إليها ، يبدو أن معالج الدعامة الخاص به يتسبب في حدوث خطأ في Android تسبب في تعطل التطبيق من حين لآخر.

لحسن الحظ ، هناك طريقة أخرى لإزالة التسطير من مكونات TextInput على Android. يمكنك إضافة سطر إلى ملف 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>

علما بأن رأيت أيضا ما يلي اقترح، ولكن هذا لم تقم بإزالة تسطير بالنسبة لنا:

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

هذا لا يعالج القضية الأساسية. إنه مجرد حل بديل يتضمن تجنب استخدام الخاصية underlineColorAndroid على مكونات TextInput .

لا يمكنني القول على وجه اليقين أن هذا يعمل بالفعل ، لأنني لم أتمكن من إعادة إظهار المشكلة محليًا. سنقوم بنشر هذا التغيير في تحديث لتطبيقنا في الأسابيع المقبلة. بعد ذلك ، سيتعين علينا الانتظار بعض الوقت لمعرفة ما إذا كان سيحدث مرة أخرى. سأحاول تقديم تقرير مع النتائج التي توصلنا إليها.

حظاً موفقاً للجميع الذين يتصارعون مع هذه القضية المحبطة! آمل أن يساعد هذا.

شكرا Hopding يبدو أن الحل الخاص بك يعمل!

تضمين التغريدة
نعم العمل شكرا جزيلا

بالنسبة لنا ، فإن هذه المشكلة وجميع المشكلات المماثلة التي تكتشف فيها طريقة الاتصال بمرجع فارغ في Android ناتجة عن عدم وجود النمط المناسب في التطبيق .

الشيء هو أن معظم مكونات react-native - إن لم يكن كلها - تمتد من مكونات appcompat ؛ أي . ومن ثم ، فإن وجود نمط مثل هذا إلزامي:

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

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

يحدث هذا لأن المكون appcopmat لم يتم تقديمه في المقام الأول ، وبالتالي فإن view.getDrawable() يُرجع قيمة فارغة لا يمكنك استدعاء أي طريقة منها مثل: setUnderlineColor أو setColorTint (المفاتيح بها هذه المشكلة أيضًا).

في حالتنا ، نظرًا لأننا كنا نستخدم react-native لإنشاء مكتبات أصلية تم تثبيتها لاحقًا في التطبيقات الأصلية ، لا يمكننا التحكم في وجود الأنماط في التطبيق النهائي. ومع ذلك ، على الأقل الآن نحن على دراية بهذه المشكلة وقمنا بتحسين وثائقنا ؛)

آمل أن يساعد!

sospedra إن تعليقك منطقي ، لكنني تحققت من الكود ووجدت أن appcompat موجود بالفعل في أسلوبي. إذا قمت بفحص حل Hopding ، فلديه أيضًا appcompat بالفعل.

تضمين التغريدة
هذا النمط يعمل بشكل جيد:

WilliamAlexander @ ، لم أتمكن من الحصول على اقتراحك للعمل. هل يمكنك تضمين النمط الكامل الذي يناسبك؟
المشكلة الأخرى التي أواجهها هي أنه عند تطبيق إصلاح @

تحديث: يجب كتابة أسلوب

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

اضطررت إلى إضافة الحشو لإصلاح كسر التخطيط.

@ gavin-gmlab.

ها هو.
"

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

"

تمت إزالة underlineColorAndroid = "شفاف"

وتغيير style.xml

انها تعمل بالنسبة لي

لم ينجح أي من الحلول المذكورة أعلاه بالنسبة لي ، ولكن يبدو أن إغلاق التطبيق بالإضافة إلى أداة التجميع وإعادة التشغيل لم ينجحا ..

ما عليك سوى مسح بيانات التطبيق وتشغيله مرة أخرى

شكرًا WilliamAlexander و Hopding على backgroundTint وهو يعمل بشكل جيد دون أي تغيير في الحشو

""

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

""

حسنًا ، هل هناك أي حل لهذا لمستخدمي إكسبو باستثناء الإخراج؟

Twishka لسوء الحظ ، سيتعين عليك إخراج رد الفعل الأصلي أيضًا ، لأن Expokit لديه نفس المشكلات.

لم أقم حتى بتعيين underlineColorAndroid في أي مكان في تطبيقي ، ما زلت أحصل على هذا السجل في وحدة التحكم في Firebase. وليس لدي أي فكرة عن كيفية إعادة إنتاج هذه المشكلة مرة أخرى.

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)

بالحديث عن الألوان ، لدي placeHolderTextColor و borderColor إلى #acacac وعندما تحدث بعض مشكلات التحقق من صحة borderColor إلى red . بصرف النظر عن ذلك ، فأنا لا أقوم بإعداد underlineColorAndroid .

هو موضع تقدير أي مساعدة.

mddanishansari نظرًا underlineColorAndroid افتراضيًا ، لذا فأنت بحاجة إلى الإصلاح المذكور أعلاه.

mddanishansari نظرًا underlineColorAndroid افتراضيًا ، لذا فأنت بحاجة إلى الإصلاح المذكور أعلاه.

شكرا جزيلا. لم أتوقع الرد بهذه السرعة. المشكلة هي أن كل الخلفية الأصلية الأصلية الأخرى EditText تكون أيضًا شفافة والتي تبدو غريبة. بعض شاشات تطبيقي هي أيضًا في الأصل الأصلي (جافا).

كنت أتساءل فقط كيف يمكن حل هذه المشكلة بالفعل. الحل المقدم هو مجرد اختراق بسيط. حق؟

اهلا ياجماعة. لذا ، فإن استخدام underlineColorAndroid يؤدي إلى حدوث هذا التعطل بطريقة ما.
ولكن الآن ، بالإضافة إلى ذلك ، يتم تعيين underlineColorAndroid افتراضيًا.
كيف يمكن تجنب استخدام هذا ، والرجوع إلى style.xml.؟

مع تحياتي

فقط في حالة أن هذا يساعد شخصًا ما. في حالتي ، كنت أرسل NaN بطريق الخطأ بدلاً من قيمة اللون الفعلية التي حدثت لي في "borderBottomLeftRadius" لم أواجه أي مشاكل مع Iphone فقط Android.

الحلول في هذا الموضوع لا تعمل بالنسبة لي. حتى عند تعيين underlineColorAndroid لجميع إدخالاتي النصية إلى شيء غير شفاف (لقد اختبرت مع '#f00' ) ، ما زلت أواجه هذه المشكلة.

بالنسبة لي ، لا تحدث المشكلة باستمرار. لدي مجموعة من مدخلات النص داخل ScrollView ، ولا بد لي من فتح وإغلاق الشاشة عدة مرات حتى تحدث

ليست الشفافية هي التي تسبب الخطأ ، إنها تغيير
اللون الأصلي من الدعامة الأصلية للتفاعل. كل شخص تقريبًا
يجعل التسطير الأصلي شفافًا مع الدعامة.

في الأربعاء 6 فبراير 2019 الساعة 10:23 مساءً كتب Adrien Pyke [email protected] :

الحلول في هذا الموضوع لا تعمل بالنسبة لي. حتى عند ضبط ملف
underlineColorAndroid لجميع إدخالاتي النصية إلى شيء غير شفاف
(اختبرت مع "# f00") ، ما زلت أواجه هذه المشكلة.

بالنسبة لي ، لا تحدث المشكلة باستمرار. لدي مجموعة من مدخلات النص
داخل ScrollView ، ولا بد لي من فتح وإغلاق الشاشة عدة مرات
لكي تحدث

-
أنت تتلقى هذا لأنك علقت.
قم بالرد على هذا البريد الإلكتروني مباشرة ، وقم بعرضه على GitHub
https://github.com/facebook/react-native/issues/17530#issuecomment-461283498 ،
أو كتم الخيط
https://github.com/notifications/unsubscribe-auth/AOG_BAlfs-GKED4gOuvtKlMD0vwEH-_zks5vK6ozgaJpZM4RaUHf
.

حسنا فهمت.

بدافع الفضول فقط حاولت إزالة القيمة الافتراضية للشفافية من هنا

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

من المثير للاهتمام أن الخطأ لا يزال يحدث بالنسبة لي

لقد واجهت للتو هذا الخطأ على RN 58.3 android. لم يكن هناك قافية أو سبب واضح ، باستثناء أنه كلما عرضت مكونًا TextInput سيظهر الخطأ. حتى لو قدمت إدخال نصي بدون دعائم أو تعديلات ، فسيظل يتعطل.

حاولت إعادة تشغيل Metro وإعادة ضبط ذاكرة التخزين المؤقت لكن ذلك لم ينجح. اضطررت بالفعل إلى فتح Android Studio وإعادة إنشاء التطبيق ، وعند هذه النقطة بدأ العمل. هل يمكن أن تكون هذه مشكلة تتعلق بعدم قيام Gradle بتجميع التبعيات بشكل صحيح أو شيء من هذا القبيل؟ تبدو وكأنها لقطة طويلة منذ أن كنت أتطور لمدة 4 ساعات جيدة دون إعادة تشغيل أي شيء قبل أن أواجه هذه المشكلة ، لكنني حقًا لا أستطيع التفكير في سبب آخر يمكن أن يسببها.

لقد واجهت هذا الخطأ في RN 58.0 على الأجهزة:
Redmi Note 6 Pro - Android 8.1
هاتف Mi A2 Lite - Android 9
WAS-LX1A - Android 8

يظهر أحيانًا من خلال النظر في Sentry ، آمل أن يساعد.

هل سيصلح المطورون هذه المشكلة؟ الحل غير مناسب لنا!

لدي نفس هذا على الإنتاج

لدينا نفس تتبع المكدس كما ورد أعلاه ، في React 0.59

(مع DrawableContainerState.createAllFutures على السطر الثاني من تتبع المكدس)

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)

لقد حصلت للتو على نفس نظام Stacktrace كما هو مذكور أعلاه بعد ترقية إصدار الإنتاج من 0.58.6 إلى 0.59.1 قبل ساعات قليلة فقط. أخشى أن تتحول إلى مشكلة خطيرة.

أي حل لهذه القضية؟

sunnylqm هل هناك طريقة لتعيين underlineColorAndroid إلى قيمة خالية ، حيث يتم تعيينها افتراضيًا؟

تضمين التغريدة
يجب عليك إزالة هذا الخط يدويًا عبر بعض أدوات التصحيح مثل إعدادات xml .
لذا فإن النقطة الأساسية هي أن not set any value to underlineColorAndroid anywhere حتى يجد أحد الأبطال طريقة لتصحيح ذلك.

لقد حصلت على هذا الخطأ اليوم
إنه يعمل بشكل جيد قبل ولكن بعد بعض الإنشاء ، حدث الخطأ على جهازي
الحل البديل لهذه المشكلة بالنسبة لي هو إلغاء تثبيت التطبيق على الجهاز ثم إعادة تثبيت التطبيق من خلال رد فعل أصلي run-android
بعد ذلك اختفت القضية

راجع للشغل ، لا أستخدم دعائم underlineColorAndroid ، لذلك فهي لا تعمل مهما قمت بتعيين أو إلغاء أي قيمة لتلك الدعائم

يحدث هذا بشكل عشوائي عند استخدام بعض إدخالات النص داخل عرض التمرير. يتم استخدام underlineColorAndroid دائمًا لأنه يتم تعيينه افتراضيًا .

حدث لي اليوم أيضًا في المعرض.

إذا كنت في Expo ، فستحتاج إلى إغلاق خادم المعرض وتطبيقك وتطبيق Expo تمامًا. وأعد فتحها مرة أخرى.

وإلا فلن يختفي الخطأ.

حدث لي في المعرض.

لسبب ما ، كانت هناك حالتان من تطبيقي في الخلفية. عندما نقرت على زر android square ، المسمى "نظرة عامة" ، لمشاهدة التطبيقات في الذاكرة ، رأيت هاتين المثيلين من تطبيقي .. عندما أغلقتهما وشغلت التطبيق مرة أخرى ، لم يظهر هذا الخطأ بعد الآن.

لذا ، كما قال الرجال سابقًا ، أغلق كل شيء وأعد التشغيل مرة أخرى يجب أن يصلح الأمر

لقد أمضيت 3 ساعات في محاولة اكتشاف هذا الخطأ بدون نتائج ، ثم أعدت تثبيت تطبيقي على محاكي android الخاص بي واختفى الخطأ.

جرب 0.59.4 لترى ما إذا كنت لا تزال تواجه هذا التعطل.

sunnylqm لا تزال تواجه هذا في 0.59.5.

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

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

لدي هذا الخطأ في أحد المكونات التي تعرض عدة إدخالات نصية ،
عند إعادة تشغيل الإنشاء أو التطبيق ، يتم تشغيله ويعود عندما أقوم بإعادة العرض للمرة الثانية.

أندرويد: 9
الهاتف: SAMSUNG Galaxy note 9
الموديل: SM-N960F / DS
النسخة الأصلية المتفاعلة "0.58.5"

محاولة استدعاء الأسلوب الافتراضي "android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)" على مرجع كائن فارغ
خلق كل المستقبل
حاوية قابلة للسحب. جافا: 875
getOpacity
حاوية قابلة للسحب. جافا: 1158
getOpacity
حاوية قابلة للسحب. جافا: 433
getOpacity
InsetDrawable. جافا: 258
computeOpaqueFlags
رأي. جافا: 18165
setBackgroundDrawable
رأي. جافا: 23335
تعيين الخلفية
رأي. جافا: 23228

رأي. جافا: 5952

عرض النص. جافا: 1108

تحرير النص. جافا: 106

تحرير النص. جافا: 102

تحرير النص. جافا: 98

تحرير النص. جافا: 94
setThemedContext
ReactTextInputShadowNode. جافا: 73
إنشاء عرض
UII التنفيذ. جافا: 288
إنشاء عرض
UIManagerModule. جافا: 449
يستحضر
طريقة. جافا
يستحضر
JavaMethodWrapper. جافا: 372
يستحضر
JavaModuleWrapper. جافا: 158
يركض
NativeRunnable.java
مقبض
معالج. جافا: 873
إرسال رسالة
معالج. جافا: 99
إرسال رسالة
MessageQueueThreadHandler. جافا: 29
عقدة
وبير. جافا: 214
يركض
MessageQueueThreadImpl. جافا: 192
يركض
مسلك. جافا: 764

أواجه نفس المشكلة أيضًا في Samsung Note 8 و Android الإصدار 9 و React الأصلي 0.57.0

نفس المشكلة هنا. رد الفعل الأصلي 0.59.0. تظهر المشكلة بشكل عشوائي عند استخدام التطبيق. لا يمكن رؤية أي نمط لها لتظهر. يحدث في كل من وضع التطوير والإنتاج.

تسببت هذه المشكلة في تعطل تطبيقنا في الإنتاج أيضًا. إنها حشرة سيئة ، لأنه من الصعب حقًا التكاثر. لقد وجدنا إصلاحًا واعدًا لتطبيقنا ، وأود مشاركة النتائج التي توصلنا إليها هنا لأتمنى توفير بعض الوقت والإحباط للآخرين.

المواصفات والإصدارات

تسبب هذا الخطأ في تعطل تطبيقنا على أجهزة Samsung و Google و LG Android. لدينا تقارير أعطال من إصدارات Android التالية:

• 8.0.0
• 8.1.0
• 7.1.1

تطبيقنا قيد التشغيل:

• react-native : 0.53.0
• react : 16.2.0

ما الذي يسبب الانهيار

كما لاحظ الآخرون في سلسلة الرسائل هذه ، يبدو أن المشكلة قد نشأت عن طريق عرض مزيج من مكونات TextInput و FlatList و ScrollView . في حالتنا ، لدينا شاشة تحتوي على TextInput معروض فوق FlatList . عند النقر على أحد العناصر الموجودة في FlatList ، ينتقل التطبيق إلى شاشة جديدة تحتوي على نموذج. المكون الجذر لهذا النموذج هو ScrollView يحتوي على عدد من مكونات TextInput (مع بعض الأزرار والمكونات المخصصة الأخرى). يتعطل تطبيقنا عندما ينقر المستخدم على أحد هذه العناصر FlatList (لاحظ أنه لا يحدث _ في كل مرة).

إعادة إنتاج هذه المشكلة أمر صعب. في الواقع ، لم نتمكن من القيام بذلك. لكننا نعلم أن التعطل يحدث في هذه المرحلة من سير العمل من خلال مشاهدة تسجيلات جلسة Appsee الخاصة بنا.

نظرًا لأنه لا يمكننا إعادة إظهار المشكلة ، فقد اضطررنا إلى الاعتماد على سجلات الأعطال من Appsee لتصحيحها. لقد قمت بنسخ تتبع المكدس من تقارير الأعطال أدناه (وحذفت بعض الأقسام المزعجة). إنها متطابقة إلى حد ما مع آثار المكدس التي تم نشرها في سلسلة الرسائل هذه من قبل الآخرين:

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)

مصدر المشكلة

بعد القراءة من خلال هذا الموضوع والقيام بضع ساعات أو البحث، وجدت underlineColorAndroid دعامة معالج في 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);
  }
}

يحتوي تقرير الخطأ المرتبط في التعليق على تتبع المكدس التالي:

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)

يتطابق هذا مع تتبع المكدس الذي نواجهه في تطبيقنا. لا أتظاهر بفهم المشكلة الأساسية تمامًا ، ولكن يبدو من المحتمل أن سبب تعطل تطبيقنا في الإنتاج يرجع إلى خطأ Drawable.mutate() الذي تم تشغيله. يحدث هذا عندما نحاول تعيين الخاصية underlineColorAndroid على مكوّننا TextInput (وبالتالي نستدعي طريقة ReactTextInputManager.setUnderlineColor ).

كان تطبيقنا يعرض TextInput مع العناصر التالية ، أحدها كان 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"
/>

كيف أصلحناه

كنا بحاجة إلى تعيين هذه الخاصية لإزالة التسطير من مكونات TextInput في تطبيقنا. ولكن بناءً على النتائج التي توصلنا إليها ، يبدو أن معالج الدعامة الخاص به يتسبب في حدوث خطأ في Android تسبب في تعطل التطبيق من حين لآخر.

لحسن الحظ ، هناك طريقة أخرى لإزالة التسطير من مكونات TextInput على Android. يمكنك إضافة سطر إلى ملف android/app/src/main/res/values/styles.xml :

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

علما بأن رأيت أيضا ما يلي اقترح، ولكن هذا لم تقم بإزالة تسطير بالنسبة لنا:

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

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

هذا لا يعالج القضية الأساسية. إنه مجرد حل بديل يتضمن تجنب استخدام الخاصية underlineColorAndroid على مكونات TextInput .

لا يمكنني القول على وجه اليقين أن هذا يعمل بالفعل ، لأنني لم أتمكن من إعادة إظهار المشكلة محليًا. سنقوم بنشر هذا التغيير في تحديث لتطبيقنا في الأسابيع المقبلة. بعد ذلك ، سيتعين علينا الانتظار بعض الوقت لمعرفة ما إذا كان سيحدث مرة أخرى. سأحاول تقديم تقرير مع النتائج التي توصلنا إليها.

حظاً موفقاً للجميع الذين يتصارعون مع هذه القضية المحبطة! آمل أن يساعد هذا.

أعرف كيف أعيد إنتاج هذا الوضع. انقر مرة أخرى في النموذج كما قلت ، ثم انقر فوق العنصر في القائمة الثابتة لإدخال النموذج. كرر حوالي عشر مرات ، وأسرع قليلاً ، سيحدث هذا الخطأ. يمكنك إعادة إنتاج الخطأ حسب ما قلته.

تضمين التغريدة
أعرف كيف أعيد إنتاج هذا الوضع. انقر مرة أخرى في النموذج كما قلت ، ثم انقر فوق العنصر في القائمة الثابتة لإدخال النموذج. كرر حوالي عشر مرات ، وأسرع قليلاً ، سيحدث هذا الخطأ. يمكنك إعادة إنتاج الخطأ حسب ما قلته.

تضمين التغريدة
لقد أزلت underlineColorAndroid ، لكنني سأعيد إنتاجه.

@ رد فعل - أصلية - بوت هذه المسألة مهمة جدا

أنا أستخدم RN 59.5 ولدي هذه المشكلة أيضًا ..

محاولة استدعاء الأسلوب الافتراضي "android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)" على مرجع كائن فارغ
خلق كل المستقبل
حاوية قابلة للسحب. جافا: 875
getOpacity
حاوية قابلة للسحب. جافا: 1158
getOpacity
حاوية قابلة للسحب. جافا: 433
getOpacity
InsetDrawable. جافا: 258
computeOpaqueFlags
رأي. جافا: 16594
setBackgroundDrawable
رأي. جافا: 21577
تعيين الخلفية
رأي. جافا: 21470

رأي. جافا: 5498

عرض النص. جافا: 875

تحرير النص. جافا: 88

تحرير النص. جافا: 84

تحرير النص. جافا: 80

تحرير النص. جافا: 76
setThemedContext
ReactTextInputShadowNode. جافا: 76
إنشاء عرض
UII التنفيذ. جافا: 294
إنشاء عرض
UIManagerModule. جافا: 462
يستحضر
طريقة. جافا
يستحضر
JavaMethodWrapper. جافا: 372
يستحضر
JavaModuleWrapper. جافا: 158
يركض
NativeRunnable.java
مقبض
معالج. جافا: 873
إرسال رسالة
معالج. جافا: 99
إرسال رسالة
MessageQueueThreadHandler. جافا: 29
عقدة
وبير. جافا: 193
يركض
MessageQueueThreadImpl. جافا: 232
يركض
مسلك. جافا: 764

أي شخص حل هذا بالفعل ؟؟ لدي هذه المشكلة في RN 52 ، قمت بالترقية إلى 56 ولكن لا يزال الخطأ. لقد جربت خطوات إعادة إنتاجه ، لكنني لا أستطيع. لا تزال بعض الأجهزة تطلق هذا بشكل عشوائي.

أي حظ في هذه القضية؟

أحصل على هذه المشكلة RN 0.59.5

تسببت هذه المشكلة في تعطل تطبيقنا في الإنتاج أيضًا. إنها حشرة سيئة ، لأنه من الصعب حقًا التكاثر. لقد وجدنا إصلاحًا واعدًا لتطبيقنا ، وأود مشاركة النتائج التي توصلنا إليها هنا لأتمنى توفير بعض الوقت والإحباط للآخرين.

المواصفات والإصدارات

تسبب هذا الخطأ في تعطل تطبيقنا على أجهزة Samsung و Google و LG Android. لدينا تقارير أعطال من إصدارات Android التالية:

• 8.0.0
• 8.1.0
• 7.1.1

تطبيقنا قيد التشغيل:

• react-native : 0.53.0
• react : 16.2.0

ما الذي يسبب الانهيار

كما لاحظ الآخرون في سلسلة الرسائل هذه ، يبدو أن المشكلة قد نشأت عن طريق عرض مزيج من مكونات TextInput و FlatList و ScrollView . في حالتنا ، لدينا شاشة تحتوي على TextInput معروض فوق FlatList . عند النقر على أحد العناصر الموجودة في FlatList ، ينتقل التطبيق إلى شاشة جديدة تحتوي على نموذج. المكون الجذر لهذا النموذج هو ScrollView يحتوي على عدد من مكونات TextInput (مع بعض الأزرار والمكونات المخصصة الأخرى). يتعطل تطبيقنا عندما ينقر المستخدم على أحد هذه العناصر FlatList (لاحظ أنه لا يحدث _ في كل مرة).
إعادة إنتاج هذه المشكلة أمر صعب. في الواقع ، لم نتمكن من القيام بذلك. لكننا نعلم أن التعطل يحدث في هذه المرحلة من سير العمل من خلال مشاهدة تسجيلات جلسة Appsee الخاصة بنا.
نظرًا لأنه لا يمكننا إعادة إظهار المشكلة ، فقد اضطررنا إلى الاعتماد على سجلات الأعطال من Appsee لتصحيحها. لقد قمت بنسخ تتبع المكدس من تقارير الأعطال أدناه (وحذفت بعض الأقسام المزعجة). إنها متطابقة إلى حد ما مع آثار المكدس التي تم نشرها في سلسلة الرسائل هذه من قبل الآخرين:

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)

مصدر المشكلة

بعد القراءة من خلال هذا الموضوع والقيام بضع ساعات أو البحث، وجدت underlineColorAndroid دعامة معالج في 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);
  }
}

يحتوي تقرير الخطأ المرتبط في التعليق على تتبع المكدس التالي:

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)

يتطابق هذا مع تتبع المكدس الذي نواجهه في تطبيقنا. لا أتظاهر بفهم المشكلة الأساسية تمامًا ، ولكن يبدو من المحتمل أن سبب تعطل تطبيقنا في الإنتاج يرجع إلى خطأ Drawable.mutate() الذي تم تشغيله. يحدث هذا عندما نحاول تعيين الخاصية underlineColorAndroid على مكوّننا TextInput (وبالتالي نستدعي طريقة ReactTextInputManager.setUnderlineColor ).
كان تطبيقنا يعرض TextInput مع العناصر التالية ، أحدها كان 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"
/>

كيف أصلحناه

كنا بحاجة إلى تعيين هذه الخاصية لإزالة التسطير من مكونات TextInput في تطبيقنا. ولكن بناءً على النتائج التي توصلنا إليها ، يبدو أن معالج الدعامة الخاص به يتسبب في حدوث خطأ في Android تسبب في تعطل التطبيق من حين لآخر.
لحسن الحظ ، هناك طريقة أخرى لإزالة التسطير من مكونات TextInput على Android. يمكنك إضافة سطر إلى ملف android/app/src/main/res/values/styles.xml :

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

علما بأن رأيت أيضا ما يلي اقترح، ولكن هذا لم تقم بإزالة تسطير بالنسبة لنا:

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

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

هذا لا يعالج القضية الأساسية. إنه مجرد حل بديل يتضمن تجنب استخدام الخاصية underlineColorAndroid على مكونات TextInput .
لا يمكنني القول على وجه اليقين أن هذا يعمل بالفعل ، لأنني لم أتمكن من إعادة إظهار المشكلة محليًا. سنقوم بنشر هذا التغيير في تحديث لتطبيقنا في الأسابيع المقبلة. بعد ذلك ، سيتعين علينا الانتظار بعض الوقت لمعرفة ما إذا كان سيحدث مرة أخرى. سأحاول تقديم تقرير مع النتائج التي توصلنا إليها.
حظاً موفقاً للجميع الذين يتصارعون مع هذه القضية المحبطة! آمل أن يساعد هذا.

أعرف كيف أعيد إنتاج هذا الوضع. انقر مرة أخرى في النموذج كما قلت ، ثم انقر فوق العنصر في القائمة الثابتة لإدخال النموذج. كرر حوالي عشر مرات ، وأسرع قليلاً ، سيحدث هذا الخطأ. يمكنك إعادة إنتاج الخطأ حسب ما قلته.

يبدو أن هذا يصلحها.

لأولئك الذين يتساءلون عن كيفية التكاثر: قمنا بإعادة إنتاجه بإضافة 100 <TextInput ...> s إلى <ScrollView ...> . في تلك المرحلة ، تمكنا من إعادة إنتاج الخطأ بمعدل نجاح يقدر بـ 75٪ -90٪. يكفي لتجربة الحلول. 50 حقلاً لم تكن كافية.

نجح حل Hopding معنا. الحل البديل المقترح "الصبغة" (من قبل الآخرين) لا يعمل. يتمثل الأثر الجانبي المؤسف للحل البديل في إزالة الحشو من مدخلات النص.

كذلك هنا.

استثناء فادح: java.lang.NullPointerException: محاولة استدعاء طريقة افتراضية 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
في android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
في android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
على android.view.View.computeOpaqueFlags (View.java:18188)
في android.view.View.setBackgroundDrawable (View.java:23358)
على android.view.View.setBackground (View.java:23251)
في android.view.View.(view.java:5948)
في android.widget.TextView.(TextView.java:1118)
في android.widget.EditText.(EditText.java:106)
في android.widget.EditText.(EditText.java:102)
في android.widget.EditText.(EditText.java:98)
في android.widget.EditText.(EditText.java:94)
على com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:89)
في com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:105)
في com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:65)
في com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:47)
في com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:256)
في com.facebook.react.uimanager.UIViewOperationQueue $ CreateViewOperation.execute (UIViewOperationQueue.java:200)
في com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:1109)
على com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.doFrameGuarded (UIViewOperationQueue.java:1080)
في com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:29)
في com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreographer.java:166)
على com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:84)
في android.view.Choreographer $ CallbackRecord.run (Choreographer.java:947)
على android.view.Choreographer.doCallbacks (Choreographer.java:761)
في android.view.Choreographer.doFrame (Choreographer.java:693)
في android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:935)
على android.os.Handler.handleCallback (Handler.java:873)
على android.os.Handler.dispatchMessage (Handler.java:99)
على android.os.Looper.loop (Looper.java:214)
على android.app.ActivityThread.main (ActivityThread.java:7045)
على java.lang.reflect.Method.invoke (Method.java)
على com.android.internal.os.RuntimeInit $ MethodAndArgsCaller.run (RuntimeInit.java:493)
في com.android.internal.os.ZygoteInit.main (ZygoteInit.java:965)

أي حل؟

هنا رمز حيث يتم إعادة إنتاج الخطأ 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,
>   }
> });
> 

فيديو: https://www.youtube.com/watch؟v=FJ6YvXrevMQ&feature=youtu.be

الحل بلز.

تم فتح هذا العدد في 11 يناير 2018 وهو مايو 2019 الآن ، فلماذا لم يتطرق إليه أحد من الفريق الرسمي؟
لمعلوماتك ، الحلول لا تعمل.

كذلك هنا 0.59.6

استثناء فادح: java.lang.NullPointerException: محاولة استدعاء طريقة افتراضية 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
في android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
في android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
على android.view.View.computeOpaqueFlags (View.java:18188)
في android.view.View.setBackgroundDrawable (View.java:23358)
على android.view.View.setBackground (View.java:23251)
في android.view.View. (View.java:5948)
في android.widget.TextView. (TextView.java:1118)
في android.widget.EditText. (EditText.java:106)
في android.widget.EditText. (EditText.java:102)
في android.widget.EditText. (EditText.java:98)
في android.widget.EditText. (EditText.java:94)
على com.facebook.react.views.textinput.ReactEditText. (ReactEditText.java:89)
في com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:105)
في com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:65)
في com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:47)
في com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:256)
في com.facebook.react.uimanager.UIViewOperationQueue $ CreateViewOperation.execute (UIViewOperationQueue.java:200)
في com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:1109)
على com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.doFrameGuarded (UIViewOperationQueue.java:1080)
في com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:29)
في com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreographer.java:166)
على com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:84)
في android.view.Choreographer $ CallbackRecord.run (Choreographer.java:947)
على android.view.Choreographer.doCallbacks (Choreographer.java:761)
في android.view.Choreographer.doFrame (Choreographer.java:693)
في android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:935)
على android.os.Handler.handleCallback (Handler.java:873)
على android.os.Handler.dispatchMessage (Handler.java:99)
على android.os.Looper.loop (Looper.java:214)
على android.app.ActivityThread.main (ActivityThread.java:7045)
على java.lang.reflect.Method.invoke (Method.java)
على com.android.internal.os.RuntimeInit $ MethodAndArgsCaller.run (RuntimeInit.java:493)
في com.android.internal.os.ZygoteInit.main (ZygoteInit.java:965)

knspatel كان الحل البديل لدينا هو تراكب الشاشة مع وضع وضع مربع إدخال النص فوق الأصل مع تعتيم بسيط في الخلفية لمعالجة تأثير الانتقال. إذا كان الإحداثي y بعيدًا عن الرؤية أو لا يمكن الوصول إليه ، فسيكون مربع إدخال النص أعلى لوحة المفاتيح مباشرةً.

دعني ألخص:
النقطة الأساسية هي عدم تعيين أي قيمة لتسطير ColorAndroid في أي مكان . ولكن منذ تعيين 0.57 underlineColorAndroid افتراضيًا ، لذلك يتعين عليك إزالة هذا الخط يدويًا عبر بعض أدوات التصحيح مثل
وإذا كنت لا تزال ترغب في جعل التسطير غير مرئي ، فأنت بحاجة إلى ضبطه في بعض إعدادات xml .

وإليك بعض المعلومات التي وجدتها حتى الآن:
ذكرت مدونة صينية (يمكنك تجربة ترجمة google إذا كنت لا تستطيع القراءة) مشكلة مشابهة جدًا لهذه المشكلة. قالت إن بعض الفئات القابلة للرسم المخصصة بدون تنفيذ getConstantState يمكن أن تتسبب في حدوث تعطل في بعض السيناريوهات.

لقد وجدت أنه في بعض الأحيان سيتم إعادة إنشاء إدخال النص (ReactEditText) (المزيد من إدخالات النص المزيد من الاحتمالات ، نوع من إعادة التدوير؟) ، وسوف يكون setBackground مرة أخرى ، ثم انتقل إلى https://github.com/aosp-mirror/ platform_frameworks_base / blob / master / graphics / java / android / graphics / drawable / DrawableContainer.java # L922 ، حيث يكون ConstantState فارغًا.

الصنف الوحيد القابل للرسم المخصص الذي وجدته هو getConstantState والذي سيعود فارغًا افتراضيًا.
حاولت تجاوزه ببعض الصفوف الفارغة ويمكن أن يحدث بعض الاختلاف (يختفي هذا الانهيار بينما يظهر الآخرون).

آمل أن يساعد هذا شخص ما على حفر المزيد.

لقد وجدت أن الاختبار اليدوي سيكون ناجحًا للغاية ، لذلك كتبت مكونًا لاختبار بعض السيناريوهات التي أبلغ عنها الأشخاص أعلاه تلقائيًا. ستجد المكون أدناه. عليك فقط أن تجعله في مكان ما ليقوم بعمله.

عند القيام بذلك ، وجدت أنك تحتاج فقط إلى إضافة ما يلي إلى AppTheme في styles.xml كما اقترحهHopding
<item name="android:editTextBackground"><strong i="7">@android</strong>:color/transparent</item>

لم يكن هناك حاجة إلى أي شيء آخر ، ولم تكن هناك حاجة إلى تجنب تعيين underlineColorAndroid ، لذلك لا يهم أن تقوم React Native الآن بتعيينها افتراضيًا.

يتمثل الجانب السلبي الرئيسي لهذا الإصلاح في أنه يتعين عليك إعادة تصميم مدخلات النص للسماح بفقدان الحشو الناتج ، كما أنك تفقد سلوك التسطير الفعلي أيضًا ، والذي كان مفيدًا لنا حيث نضعه دائمًا على "شفاف" لتكون متسقة مع iOS. إذا كنت في حاجة إليها ، فيمكنك إنشاء مكون غلاف يشاهد onFocus و onBlur ويصنع تسطيرًا خاصًا بك.

إصداري من React Native هو 0.57.3

فيما يلي بعض الأشياء الأخرى التي وجدتها باستخدام مكون الاختبار الخاص بي:

1. لم أستطع التسبب في الانهيار على الإطلاق على جهازي اللوحي منخفض المواصفات الذي يعمل بنظام Android. كان من السهل جدًا إعادة الإنتاج ولكن على هاتفي Samsung S6 Edge الذي يعمل بنظام Android 7. أعتقد أن هناك حالة سباق تحتاج إلى جهاز أسرع لاستفزازها.
2. لم يُحدث التمرير في مدخلات النص أي فرق ، ويمكنني بسهولة إعادة إنتاج المشكلة دون استخدام ScrollView.
3. لم يكن إدخال النص ضروريًا. كان مجرد تغيير التركيز كافيًا للتسبب في الانهيار.
4. لم يُحدث أي اختلاف في اللون الذي قمت بتعيين التسطير إليه ، حتى أن undefined تسبب في الانهيار ، ولكن ربما تتوقع ذلك نظرًا لأن RN الآن تجعله افتراضيًا على "شفاف"
5. أدى ظهور عدد لا بأس به من مدخلات النص في وقت واحد إلى إحداث فرق مع حدوث الانهيار بشكل أسرع مع 100 ، بدلاً من 10 فقط على الشاشة.
6. لم أتمكن من إعادة إنتاج العطل باستخدام displayForMs: 0 مما يشير إلى أنه يحدث فقط عندما يتم إنشاء مدخلات النص مؤخرًا فقط.

إذا كنت لا ترغب في التوقف أثناء الاختبار ، يمكنك التقاط ناتج adb logcat والبحث عن رسائل وحدة التحكم التي ينتجها المكون وتقرير الأعطال.

هنا هو مكون الاختبار الخاص بي إذا كنت ترغب في استخدامه. تم تعيين معلمات الاختبار لتتسبب في حدوث عطل عادةً في أقل من 30 ثانية بالنسبة لي.

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

بالنسبة إلى كل من يبحثون عن حل ، يمكنني أيضًا تأكيد هذا الإعدادandroid : ملون / شفاف في styles.xml إصلاح المشكلة.

لمعلوماتك: نحن نستخدم React-Native Paper ومكون إدخال النص الخاص بهم وتمكنا من تعيين <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> بأمان دون أي تأثير على RN-Paper TextInput ولم نواجه الانهيار منذ ذلك الحين.

رؤية في الإنتاج على 0.59.9 .

Crashlytics:

Samsung Galaxy S7 Edge
أندرويد 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)

تغيير هذا:

state = {
  data: []
}

الى هذا:

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

أصلح المشكلة بالنسبة لي. ألست متأكدًا من السبب لأن تعيين الحالة كمتغير فئة يجب أن يكون جيدًا؟ أي واحد؟

wbodron لا ، هذا ليس له علاقة. التعطل عشوائي لذا قد تعتقد أنه ذهب ولكن في الواقع لم يحدث. والنقطة الأساسية التي شرحتها أعلاه https://github.com/facebook/react-native/issues/17530#issuecomment -500865260

تضمين التغريدة ccpojersherginsahrens

حذف مجلد البناء من android.
Your_Project> android> app> build

بعد حذفه ، قم بتشغيل react-native run-android

يجب أن تعمل بشكل جيد.
عملت لي: د

لقد جربت هذا بالفعل وأزلت underlineColorAndroid ولكن ما زلت أعاني من المشكلة. أي شخص لديه حل آخر؟

تسببت هذه المشكلة في تعطل تطبيقنا في الإنتاج أيضًا. إنها حشرة سيئة ، لأنه من الصعب حقًا التكاثر. لقد وجدنا إصلاحًا واعدًا لتطبيقنا ، وأود مشاركة النتائج التي توصلنا إليها هنا لأتمنى توفير بعض الوقت والإحباط للآخرين.

المواصفات والإصدارات

تسبب هذا الخطأ في تعطل تطبيقنا على أجهزة Samsung و Google و LG Android. لدينا تقارير أعطال من إصدارات Android التالية:

• 8.0.0
• 8.1.0
• 7.1.1

تطبيقنا قيد التشغيل:

• react-native : 0.53.0
• react : 16.2.0

ما الذي يسبب الانهيار

كما لاحظ الآخرون في سلسلة الرسائل هذه ، يبدو أن المشكلة قد نشأت عن طريق عرض مزيج من مكونات TextInput و FlatList و ScrollView . في حالتنا ، لدينا شاشة تحتوي على TextInput معروض فوق FlatList . عند النقر على أحد العناصر الموجودة في FlatList ، ينتقل التطبيق إلى شاشة جديدة تحتوي على نموذج. المكون الجذر لهذا النموذج هو ScrollView يحتوي على عدد من مكونات TextInput (مع بعض الأزرار والمكونات المخصصة الأخرى). يتعطل تطبيقنا عندما ينقر المستخدم على أحد هذه العناصر FlatList (لاحظ أنه لا يحدث _ في كل مرة).
إعادة إنتاج هذه المشكلة أمر صعب. في الواقع ، لم نتمكن من القيام بذلك. لكننا نعلم أن التعطل يحدث في هذه المرحلة من سير العمل من خلال مشاهدة تسجيلات جلسة Appsee الخاصة بنا.
نظرًا لأنه لا يمكننا إعادة إظهار المشكلة ، فقد اضطررنا إلى الاعتماد على سجلات الأعطال من Appsee لتصحيحها. لقد قمت بنسخ تتبع المكدس من تقارير الأعطال أدناه (وحذفت بعض الأقسام المزعجة). إنها متطابقة إلى حد ما مع آثار المكدس التي تم نشرها في سلسلة الرسائل هذه من قبل الآخرين:

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)

مصدر المشكلة

بعد القراءة من خلال هذا الموضوع والقيام بضع ساعات أو البحث، وجدت underlineColorAndroid دعامة معالج في 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);
  }
}

يحتوي تقرير الخطأ المرتبط في التعليق على تتبع المكدس التالي:

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)

يتطابق هذا مع تتبع المكدس الذي نواجهه في تطبيقنا. لا أتظاهر بفهم المشكلة الأساسية تمامًا ، ولكن يبدو من المحتمل أن سبب تعطل تطبيقنا في الإنتاج يرجع إلى خطأ Drawable.mutate() الذي تم تشغيله. يحدث هذا عندما نحاول تعيين الخاصية underlineColorAndroid على مكوّننا TextInput (وبالتالي نستدعي طريقة ReactTextInputManager.setUnderlineColor ).
كان تطبيقنا يعرض TextInput مع العناصر التالية ، أحدها كان 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"
/>

كيف أصلحناه

كنا بحاجة إلى تعيين هذه الخاصية لإزالة التسطير من مكونات TextInput في تطبيقنا. ولكن بناءً على النتائج التي توصلنا إليها ، يبدو أن معالج الدعامة الخاص به يتسبب في حدوث خطأ في Android تسبب في تعطل التطبيق من حين لآخر.
لحسن الحظ ، هناك طريقة أخرى لإزالة التسطير من مكونات TextInput على Android. يمكنك إضافة سطر إلى ملف android/app/src/main/res/values/styles.xml :

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

علما بأن رأيت أيضا ما يلي اقترح، ولكن هذا لم تقم بإزالة تسطير بالنسبة لنا:

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

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

هذا لا يعالج القضية الأساسية. إنه مجرد حل بديل يتضمن تجنب استخدام الخاصية underlineColorAndroid على مكونات TextInput .
لا يمكنني القول على وجه اليقين أن هذا يعمل بالفعل ، لأنني لم أتمكن من إعادة إظهار المشكلة محليًا. سنقوم بنشر هذا التغيير في تحديث لتطبيقنا في الأسابيع المقبلة. بعد ذلك ، سيتعين علينا الانتظار بعض الوقت لمعرفة ما إذا كان سيحدث مرة أخرى. سأحاول تقديم تقرير مع النتائج التي توصلنا إليها.
حظاً موفقاً للجميع الذين يتصارعون مع هذه القضية المحبطة! آمل أن يساعد هذا.

أعرف كيف أعيد إنتاج هذا الوضع. انقر مرة أخرى في النموذج كما قلت ، ثم انقر فوق العنصر في القائمة الثابتة لإدخال النموذج. كرر حوالي عشر مرات ، وأسرع قليلاً ، سيحدث هذا الخطأ. يمكنك إعادة إنتاج الخطأ حسب ما قلته.

ماذا افعل؟ أنا أواجه هذه المشكلة أيضًا!

كذلك هنا. مواجهتها في الإنتاج

@ jake41 حاولت إعادة تشغيله وعمل ، هل حاولت إعادة تشغيله؟ أواجه هذه المشكلة بعد أن أقوم بتحديث expo cli ، وأعتقد أن مشكلة الإصدار.

agrass سأحاول طريقتك. تبدو واعدة.
لكن تطبيقي يتعطل نادرًا جدًا بسبب هذا السبب. هل تؤدي هذه المشكلة إلى تعطل التطبيق في كل مرة؟ أو في بعض الأحيان؟
يبلغ DAU لتطبيقنا حوالي 8 كيلو بايت ، وهذا يحدث مرة واحدة تقريبًا في اليوم. لذا ، هذا لا يكاد يذكر ، لكني آمل أن أعالج الحادث.

هل وجد أي شخص إصلاح العمل المناسب لها؟ نادرًا ما يحدث ذلك وفقط في المكون الذي يوجد به حقل نصي.

لا تزال المشكلة قائمة مع React Native 0.60

رد الفعل الأصلي: 0.59.8
أندرويد: 8.1.0
الجهاز: 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)

لديك نفس المشكلة هنا
آكانيوز: 0.59.9
الجهاز: Pixel 2
أندرويد: 9.0

إذا كانت شاشة نموذج ، فقد تنتظر تحديد القيم في المدخلات ، فقد نجحت بالنسبة لي.

لقد وجدت حلاً. لست متأكدًا مما إذا كانت طويلة الأجل ، ولكن هذا سيسمح لك يا رفاق بالعمل حتى يتم العثور على حل دائم.
ما عليك سوى مسح أموالك: npm start - --reset-cache
وأعد تشغيل المشروع.
عملت معي.
لمعلوماتك ، لم أخرج مشروعي بعد.
تبعياتي:

"devDependencies": {
"@ أنواع / رد فعل": "^ 16.8.23"،
"@ أنواع / رد فعل أصلي": "^ 0.57.65"،
"babel-preset-expo": "^ 6.0.0"،
"typecript": "^ 3.4.5"
} ،

وزن مستخدم ExpoKit (SDK 34) هنا. لقد واجهت هذه المشكلة في جميع إصدارات ExpoKit ، بما في ذلك الأحدث. لقد حاولت تطبيق هذه الإصلاحات ، مع بعض التعديلات ، وحتى الآن ، جيد جدًا.

انتهى الأمر بتغيير النمط إلى أن يكون مختلفًا قليلاً عن @ Hopding - لقد كان العكس هو ExponentEditText في styles.xml على النحو التالي:

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

نظرًا لأن التغيير إلى android:editTextBackground لم ينجح (ربما يكون له علاقة بنمط ExponentEditText بالفعل). ومن المثير للاهتمام ، أنني لم أضطر إلى تصحيح الخاصية الافتراضية التي حددت underlineColorAndroid إلى transparent . لدي مشكلة الحشو. ومع ذلك شعرت أنه كان في الواقع تحسنًا ، حيث لم أعد مضطرًا للتعامل مع الحشو الداخلي لإدخال النص عندما يكون فارغًا وأحاول وضع مكونات أخرى بالقرب منه.

في السابق ، كنت قادرًا على تشغيل الخطأ بشكل موثوق من خلال زر التشخيص الذي أضفته إلى تطبيقنا الذي أضاف 500 TextInputs إلى SectionList. أود أن أقول إنه يتسبب في 60٪ من الوقت في المحاولة الأولى ، و 90٪ في الثانية ، و 100٪ في الثالثة في تجربتي. حاولت ذلك 10 مرات على الأقل دون خطأ بعد أن أجريت التغيير.

لديك نفس المشكلة هنا
آكانيوز: 0.55.4
الجهاز: MI 8 Lite
أندرويد: 8.1.0

java.lang.NullPointerException: محاولة استدعاء طريقة افتراضية 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
في android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
في android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)
على android.view.View.computeOpaqueFlags (View.java:15748)
في android.view.View.setBackgroundDrawable (View.java:20558)
على android.view.View.setBackground (View.java:20451)
في android.view.View.(مشاهدة. java:5255)
في android.widget.TextView.(TextView.java:826)
في android.widget.EditText.(EditText.java:88)
في android.widget.EditText.(EditText.java:84)
في android.widget.EditText.(EditText.java:80)
في android.widget.EditText.(EditText.java:76)
في com.facebook.react.views.textinput.ReactTextInputShadowNode.setThemedContext (ReactTextInputShadowNode.java:80)
في com.facebook.react.uimanager.UIImplementation.createView (UIImplementation.java:282)
في com.facebook.react.uimanager.UIManagerModule.createView (UIManagerModule.java:366)
على java.lang.reflect.Method.invoke (Method.java)
في com.facebook.react.bridge.JavaMethodWrapper.invoke (JavaMethodWrapper.java:372)
في com.facebook.react.bridge.JavaModuleWrapper.invoke (JavaModuleWrapper.java:160)
في com.facebook.react.bridge.queue.NativeRunnable.run (NativeRunnable.java)
على android.os.Handler.handleCallback (Handler.java:790)
على android.os.Handler.dispatchMessage (Handler.java:99)
على com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage (MessageQueueThreadHandler.java:29)
على android.os.Looper.loop (Looper.java:164)
في com.facebook.react.bridge.queue.MessageQueueThreadImpl $ 3.run (MessageQueueThreadImpl.java:192)
في java.lang.Thread.run (Thread.java:764)

استثناء فادح: java.lang.NullPointerException
محاولة استدعاء الأسلوب الافتراضي "android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)" على مرجع كائن فارغ

فيفو 1804
إصدار أندرويد: 9

يحدث لي. React Native version 0.60.4 يعمل بنظام Android 9. متقطع جدًا ونادرًا.

يحدث لي. React Native version 0.60.4 يعمل بنظام Android 9. متقطع جدًا ونادرًا.

نفس الشيء معي أيضًا ...

نفس الشيء هنا ، React Native 0.60.4 على Android 9

أستخدم React Native مع Expo ، وقد واجهت هذه المشكلة هذا الصباح.
حاولت أولاً وضع هذا السطر في ملف Styles.xml AppTheme مثل هذا

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

لم ينجح الأمر ، لذلك بحثت عن مكان آخر ، وأخيراً وضعته هناك:

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

يبدو أنه يعمل بشكل جيد الآن

هذا الانهيار عشوائي جدا. تتبع المكدس نفسه ، v0.60.4. نفس الخطأ. هل هناك حل؟ اقترح شخص ما حذف مجلد الإنشاء لكني لا أرى علاقة ذلك بمؤشر فارغ؟ يبدو أن الحل دائمًا هو إعادة البناء / إعادة التشغيل

armagedanjacobbeasley آخرون المشكلة _is_ متقطعة ولذلك قد ترغب في محاولة الهبوط في عنصر منصوص عليه في تعليقي أعلاه لإعادة إنتاجه. يوفر هذا التعليق أيضًا تحليلًا للمشكلة وحلًا يناسبني والعديد من الآخرين.

wxjer أحاول مسح بيانات التطبيق عند الإعداد وهو يعمل! هل يمكنك تجربته

نفس الشيء هنا ، React Native 0.60.4 على Android 9 و Android 8

اي حل؟

في حال كان أي شخص لديه نظرة جيدة لتصحيح أخطاء Android ، فإليك خطأ الحارس الذي تم الإبلاغ عنه للتو.

رد الفعل الأصلي 0.60.4

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

نفس الشيء هنا ، React Native 0.60.5 على Android 9

مرحبا! لقد قمنا بحل هذا عن طريق إزالة خاصية underlineColorAndroid من إدخال النص لدينا وإضافة هذا السطر إلى styles.xml من الداخل (android / src / main / res / القيم / styles.xml)

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

هل هذا تقرير الشوائب؟

نعم

هل قرأت إرشادات المساهمة ؟

نعم ، أنا آسف لأنني لا أستطيع تقديم المزيد من المعلومات حول هذا الاستثناء باستثناء تتبع المكدس هذا لأنه تم جمع تقرير التعطل من تحليلات جوجل ، وليس لدي أي فكرة لإعادة ظهور هذا الاستثناء.

بيئة

بيئة:
نظام التشغيل: macOS Sierra 10.12.6
العقدة: 8.4.0
الغزل: 0.27.5
npm: 5.4.0
Android Studio: 3.0

الحزم: (مطلوب => مثبت)
تفاعل أصلي: 0.51.0 => 0.51.0
التفاعل: 16.0.0-alpha.12 => 16.0.0-alpha.12

المنصة المستهدفة: Android (7.1.1)
الجوال: MIX 2
أندرويد: 7.1.1
java.lang.NullPointerException:
إغراء استدعاء الأسلوب الافتراضي 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ في
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) في
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) في
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.view.View.drawableStateChanged (View.java:18002) في
android.widget.TextView.drawableStateChanged (TextView.java:4097) في
android.view.View.refreshDrawableState (View.java:18071) في
android.view.View.setPressed (View.java:8543) في
android.view.View.setPressed (View.java:8521) في
android.view.View.onTouchEvent (View.java:11218) في
android.widget.TextView.onTouchEvent (TextView.java:8467) في
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

رد فعل أصلي 0.60.4 أنا أيضًا

بدأ الوقوع في هذا الانهيار مؤخرًا ، RN 0.60.5 ، بشكل أساسي على Android 8/9 (ربما 10 أيضًا ، لم يختبر ذلك على نطاق واسع حتى الآن).

https://github.com/facebook/react-native/issues/17530#issuecomment -504044357 يبدو أنه يفعل الحيلة بالنسبة لي. عادة ، سيظهر الانهيار نفسه خلال ~ 5 تكرارات الأولى التي يمر بها مكون الاختبار. بعد إضافة هذا السطر ، تم تشغيله لـ 200 تكرار تقريبًا دون تعطل قبل أن أوقفه.

تحرير: باستخدام مكون الاختبار ، يمكنني إعادة إنتاج هذا بشكل موثوق على Android 6 أيضًا ، على الرغم من أن الإصلاح المقترح مرة أخرى يبدو أنه يحل المشكلة.

نفس الشيء هنا على RN 0.61

مرحبًا يا شباب ، حل diegotsi يعمل معي. لم أرَ الحادث مطلقًا منذ أن استخدمت حله

لا تزال هذه المشكلة موجودة وقد كسرت تطبيقي - كان كل شيء يعمل بشكل جيد مما أضفته إلى مكالمة جلب والآن حتى عندما أعلق عليها لا يمكنني تشغيل التطبيق مرة أخرى: أبكي: أنا أستخدم Expo بالمناسبة

تحرير: لقد أصلحت مشكلتي للمعرض بإعادة تثبيت تطبيق المعرض على جهازي

ركض في هذا الخطأ أيضًا (RN: 0.61.1 ، Android 10 api 29). يبدو أن "npm start --reset-cache" تم إصلاحه.

johnbowdenatfacet ، قد ترغب في تجربة مكون اختبار الإفلات المقدم في تعليقي أعلاه لتأكيد الإصلاح.

المشكلة نفسها.

رد الفعل الأصلي 0.59.10
ذكري المظهر

java.lang.NullPointerException: محاولة استدعاء طريقة افتراضية 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875)
في android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158)
في android.graphics.drawable.DrawableContainer.getOpacity (DrawableContainer.java:433)
في android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258)

المشكلة نفسها.

مرحبا! لقد قمنا بحل هذا عن طريق إزالة خاصية underlineColorAndroid من إدخال النص لدينا وإضافة هذا السطر إلى styles.xml من الداخل (android / src / main / res / القيم / styles.xml)

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

حل مشكلتي شكرا جزيلا لك.

لقد قمت للتو بتشغيل (رد فعل-تشغيل-أندرويد) ، والذي حل المشكلة معي

نفس المشكلة في 0.61.3

ما زلت أواجه المشكلة. لدينا بعض المستخدمين يبلغون عن أعطال في تطبيق Android ، ولكن هذا يحدث بشكل عشوائي بحيث لا يمكنني التكاثر.

+1 ، حدث لي أيضًا

pedrosimao ، قد ترغب في تجربة مكون اختبار تعليقي أعلاه لإعادة إنتاج الخطأ بشكل موثوق. يشير هذا التعليق أيضًا إلى حل للمشكلة.

لقد قمت بتضييق نطاق المشكلة في المدخلات الخاصة بي والتي يتم استيرادها من القاعدة الأصلية.

محدث:
لقد أعدت تشغيل جهاز الكمبيوتر والهاتف ثم أعدت التشغيل مرة أخرى ، لقد عملت مثل السحر :)

كان لدي هذا أيضا. لقد قمت بحل المشكلة عن طريق إعادة تشغيل المعرض عبر expo r -c

الإبلاغ عن نفس المشكلة لـ RN 0.59.10

لقد وجدت أن الاختبار اليدوي سيكون ناجحًا للغاية ، لذلك كتبت مكونًا لاختبار بعض السيناريوهات التي أبلغ عنها الأشخاص أعلاه تلقائيًا. ستجد المكون أدناه. عليك فقط أن تجعله في مكان ما ليقوم بعمله.

عند القيام بذلك ، وجدت أنك تحتاج فقط إلى إضافة ما يلي إلى AppTheme في styles.xml كما اقترحهHopding
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>

لم يكن هناك حاجة إلى أي شيء آخر ، ولم تكن هناك حاجة إلى تجنب تعيين underlineColorAndroid ، لذلك لا يهم أن تقوم React Native الآن بتعيينها افتراضيًا.

يتمثل الجانب السلبي الرئيسي لهذا الإصلاح في أنه يتعين عليك إعادة تصميم مدخلات النص للسماح بفقدان الحشو الناتج ، كما أنك تفقد سلوك التسطير الفعلي أيضًا ، والذي كان مفيدًا لنا حيث نضعه دائمًا على "شفاف" لتكون متسقة مع iOS. إذا كنت في حاجة إليها ، فيمكنك إنشاء مكون غلاف يشاهد onFocus و onBlur ويصنع تسطيرًا خاصًا بك.

إصداري من React Native هو 0.57.3

فيما يلي بعض الأشياء الأخرى التي وجدتها باستخدام مكون الاختبار الخاص بي:

1. لم أستطع التسبب في الانهيار على الإطلاق على جهازي اللوحي منخفض المواصفات الذي يعمل بنظام Android. كان من السهل جدًا إعادة الإنتاج ولكن على هاتفي Samsung S6 Edge الذي يعمل بنظام Android 7. أعتقد أن هناك حالة سباق تحتاج إلى جهاز أسرع لاستفزازها.
2. لم يُحدث التمرير في مدخلات النص أي فرق ، ويمكنني بسهولة إعادة إنتاج المشكلة دون استخدام ScrollView.
3. لم يكن إدخال النص ضروريًا. كان مجرد تغيير التركيز كافيًا للتسبب في الانهيار.
4. لم يُحدث أي اختلاف في اللون الذي قمت بتعيين التسطير إليه ، حتى أن undefined تسبب في الانهيار ، ولكن ربما تتوقع ذلك نظرًا لأن RN الآن تجعله افتراضيًا على "شفاف"
5. أدى ظهور عدد لا بأس به من مدخلات النص في وقت واحد إلى إحداث فرق مع حدوث الانهيار بشكل أسرع مع 100 ، بدلاً من 10 فقط على الشاشة.
6. لم أتمكن من إعادة إنتاج العطل باستخدام displayForMs: 0 مما يشير إلى أنه يحدث فقط عندما يتم إنشاء مدخلات النص مؤخرًا فقط.

إذا كنت لا ترغب في التسكع أثناء الاختبار ، يمكنك التقاط ناتج adb logcat والبحث عن رسائل وحدة التحكم التي ينتجها المكون وتقرير الأعطال.

هنا هو مكون الاختبار الخاص بي إذا كنت ترغب في استخدامه. تم تعيين معلمات الاختبار لتتسبب في حدوث عطل عادةً في أقل من 30 ثانية بالنسبة لي.

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

حاولت ذلك ولكن لوحة المفاتيح لم تكن تظهر على TextInputs. أي حلول؟

شكرا لتجربة المكون الخاص بيsaketkumar.

لا يمكنني تذكر ما إذا كانت لوحة المفاتيح بحاجة إلى الظهور لهذا الاختبار ، على الرغم من أنني أتوقع ظهورها عند التركيز على إدخال النص. هل تستخدم جهازًا حقيقيًا أم محاكيًا؟

هل يمكن أن ترى المؤشر يظهر في مدخلات النص حيث تم التركيز عليها ، وهل كان المكون قادرًا على إعادة إنتاج التعطل من أجلك؟

نفس الشيء

يحدث في رد فعل 0.59 على مجموعة متنوعة من هواتف Android.

يحدث بشكل عشوائي في المكونات مع TextInput متداخلة داخل Flatlist

حاولت تعيين underlineColorAndroid={null} atrribute على TextInput كما تمت مناقشته في سلسلة الرسائل هذه ولكن الخطأ استمر

اضطررت إلى إعادة تشغيل هاتفي وإعادة تثبيت EXPO حتى يتم إصلاحه. إذا لم ينجح ذلك معك ، فسأحاول مسح ذاكرة التخزين المؤقت ومسح ذاكرة التخزين المؤقت لتطبيق EXPO نفسه.

ليس لدي فكرة كيف حدث هذا الخطأ في المقام الأول. لم أتمكن من إعادة إنشائه أو اكتشاف كيفية منعه من حدوث ذلك مرة أخرى.
لقد بدأت للتو وبغض النظر عما قمت بتغييره في الكود الخاص بي ، فإنه لم يتم إصلاحه. إنها بالتأكيد مشكلة EXPO APP لأنني أرى الخطأ في التطبيق ولكن ليس في وحدة التحكم الخاصة بي أو في أي مكان آخر.

+1 لا يزال موجودًا في RN 0.59.9. أبلغت من firebase Cracklytics

أول من حصل على هذا الخطأ على RN 0.61؟

الحصول على نفس الخطأ في RN 0.61 ، حلها حل
هذه مشكلة خطيرة ، كما حدث لي لأول مرة في بيئة ما قبل الإنتاج ، ولم أكن لأتمكن مطلقًا من تتبعها بدون التعرّض للكسر ، لأن السلوك غير المنتظم يجعل من الصعب التكاثر.

هل هذا تقرير الشوائب؟

نعم

هل قرأت إرشادات المساهمة ؟

نعم ، أنا آسف لأنني لا أستطيع تقديم المزيد من المعلومات حول هذا الاستثناء باستثناء تتبع المكدس هذا لأنه تم جمع تقرير التعطل من تحليلات جوجل ، وليس لدي أي فكرة لإعادة ظهور هذا الاستثناء.

بيئة

بيئة:
نظام التشغيل: macOS Sierra 10.12.6
العقدة: 8.4.0
الغزل: 0.27.5
npm: 5.4.0
Android Studio: 3.0

الحزم: (مطلوب => مثبت)
تفاعل أصلي: 0.51.0 => 0.51.0
التفاعل: 16.0.0-alpha.12 => 16.0.0-alpha.12

المنصة المستهدفة: Android (7.1.1)
الجوال: MIX 2
أندرويد: 7.1.1
java.lang.NullPointerException:
إغراء استدعاء الأسلوب الافتراضي 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ في
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) في
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) في
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.view.View.drawableStateChanged (View.java:18002) في
android.widget.TextView.drawableStateChanged (TextView.java:4097) في
android.view.View.refreshDrawableState (View.java:18071) في
android.view.View.setPressed (View.java:8543) في
android.view.View.setPressed (View.java:8521) في
android.view.View.onTouchEvent (View.java:11218) في
android.widget.TextView.onTouchEvent (TextView.java:8467) في
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

هل هذا تقرير الشوائب؟

نعم

هل قرأت إرشادات المساهمة ؟

نعم ، أنا آسف لأنني لا أستطيع تقديم المزيد من المعلومات حول هذا الاستثناء باستثناء تتبع المكدس هذا لأنه تم جمع تقرير التعطل من تحليلات جوجل ، وليس لدي أي فكرة لإعادة ظهور هذا الاستثناء.

بيئة

بيئة:
نظام التشغيل: macOS Sierra 10.12.6
العقدة: 8.4.0
الغزل: 0.27.5
npm: 5.4.0
Android Studio: 3.0

الحزم: (مطلوب => مثبت)
تفاعل أصلي: 0.51.0 => 0.51.0
التفاعل: 16.0.0-alpha.12 => 16.0.0-alpha.12

المنصة المستهدفة: Android (7.1.1)
الجوال: MIX 2
أندرويد: 7.1.1
java.lang.NullPointerException:
إغراء استدعاء الأسلوب الافتراضي 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ في
android.graphics.drawable.DrawableContainer $ DrawableContainerState.getChild (DrawableContainer.java:888) في
android.graphics.drawable.DrawableContainer.selectDrawable (DrawableContainer.java:466) في
android.graphics.drawable.StateListDrawable.onStateChange (StateListDrawable.java:104) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.graphics.drawable.DrawableWrapper.onStateChange (DrawableWrapper.java:331) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.graphics.drawable.LayerDrawable.onStateChange (LayerDrawable.java:1488) في
android.graphics.drawable.Drawable.setState (Drawable.java:735) في
android.view.View.drawableStateChanged (View.java:18002) في
android.widget.TextView.drawableStateChanged (TextView.java:4097) في
android.view.View.refreshDrawableState (View.java:18071) في
android.view.View.setPressed (View.java:8543) في
android.view.View.setPressed (View.java:8521) في
android.view.View.onTouchEvent (View.java:11218) في
android.widget.TextView.onTouchEvent (TextView.java:8467) في
com.facebook.react.views.textinput.ReactEditText.onTouchEvent (ReactEditText.java:150)

يحدث هذا عندما أقوم بتغيير شيء ما في النمط مثل حذف justifyContent أو smthng مثل هذا وإعادة تشغيل التطبيق يعمل مؤقتًا.

cinocai ، Sargnec وآخرون ، أصبح موضوع التعليقات هذا طويلاً لدرجة أنني أعتقد أن الأشخاص يفتقدون إلى مكون الاختبار الذي نشرته أعلاه

استخدمه العديد من الأشخاص أعلاه لإعادة إنتاج هذه المشكلة بنجاح ، والتحقق من الحل ، المذكور أيضًا في هذا التعليق.

@ glenn-axsy: كان العمل الرائع مع عنصر الاختبار مفيدًا جدًا في فهم المشكلة بشكل أفضل.
لكني أجد صعوبة في إيجاد حل.

كما اقترحت عند إعداد displayForMs: 0 فإنه لا يتلف. إذا لم أكن مخطئًا ، فمن خلال القيام بذلك ، فإن المدخلات النصية 100 لا تنفصل أبدًا (تحديثات فقط) ، ولا توجد أخرى جديدة أيضًا.

لقد حاولت تعيين displayForMs: 3000 نفسه وقمت بإجراء تغييرين آخرين ، مما أدى إلى تثبيت كل 100 (التحديث فقط) في كل حالة.

التغييرات

• مفتاح const = this.state.startKey + i + "" ؛ ---> مفتاح ثابت = ${i} ؛
• الشيك معطل if (this.state.showInputs) { داخل تصيير.

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

تأكد كلا التغييرين من أن استدعاء _showInputs و _unshowInputs لن يقوم بإعادة تحميل مدخلات النص ، ولن يقوم بتركيب أي جديد (بحد أقصى 100).
ولا تتحطم كما هو متوقع.

أخيرًا للتأكد مما إذا كانت إعادة التحميل (عدد كبير من إدخال النص) هي التي تسبب المشكلة. حاولت إعادة إنتاجه في التطبيق الذي أعمل عليه ، حيث تم الإبلاغ عن العطل.

يوجد في التطبيق شاشتان ، إحداهما بها 2 TextInputs والأخرى بـ 4 ، واصلت التنقل ذهابًا وإيابًا بين الشاشات ، والتي بالطبع تعيد تحميل محتويات الشاشة بالكامل ، وفي النهاية تمكنت بعد فترة من الحصول على التعطل.

من خلال هذا يمكنني أن أستنتج أن عدم السماح بإلغاء تحميل TextInput ليس حلاً قابلاً للتطبيق. ولكن لا يوجد حتى الآن فكرة عن سبب هذا بالضبط!

ملحوظة

• لا أعتقد أنه مرتبط بخاصية underlineColorAndroid ، لأنني حاولت تجاوزها بـ <item name="android:editTextBackground"><strong i="18">@android</strong>:color/transparent</item> ، ولا فرق. [تم التعديل: يعمل بالفعل على إصلاح المشكلة في الوقت الحالي]
• كما أنني تمكنت من التعطل بدون استخدام ScrollView .
• كما أن التركيز على TextInput لم يكن ضروريًا أيضًا للحصول على الانهيار ، فقد أدى ببساطة إعادة حساب TextInputs 100 إلى الانهيار.

شكر!

rimzici نعم هذا صحيح. يرتبط التعطل بإعادة تركيب / إنشاء نص محرر في بعض الأحيان تكون عناصر رسم الخلفية فارغة. لكن الغريب أنه عندما تقوم بتعيين <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> لن يحدث ذلك. يبدو أن العناصر القابلة للرسم قد أعيد تدويرها بطريقة ما بعد الاستنساخ وعند تعيين خلفية يمكن أن يكون لها قيمة افتراضية؟

شكراrimzici.

إنه لأمر محبط أن نسمع أن مجرد تعيين <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> لم يصلح لك. على الأقل لديك طريقة لإعادة إنتاج الخطأ بسهولة الآن ويمكنك تجربة بعض الأشياء الأخرى.

يرجى نشر أي ملاحظات أخرى قد تكون لديك.

شكرا sunnylqm و @ جلين-اكسسي! أنت محق ، تعيين <item name="android:editTextBackground"><strong i="6">@android</strong>:color/transparent</item> يصلح بالفعل.

لقد نسيت أنه تم تعيين سمة البداية في نشاطي الرئيسي ، لتغطية الشاشة البيضاء أثناء تحميل JS.

يمكنني الآن أن أؤكد أن الحل البديل فعال في منع التعطل.

سيتم التحديث بأي معلومات أخرى.

رد الفعل الأصلي 0.61.5 <- هنا أيضًا!

رد فعل أصلي 0.62.0.rc-1 <- هنا أيضًا!

نفس الخطأ في [email protected]

ضرب العديد من حالات حدوث نفس الخطأ الذي تم اكتشافه بواسطة Sentry: https://sentry.io/share/issue/ac1e7c55f1594b118f0faaf8d11de5c4/

على RN 0.59.9

نفس الخطأ في RN 0.55.4

نفس المشكلة على RN 2.0.1

لا تقم بتعيين دعائم "underlineColorAndroid" على أي TextInput وقم بإزالة كل خلفية إدخال النص بواسطة الأنماط الأصلية.

انتقل إلى android \ app \ src \ main \ res \ القيم \ styles.xml

قم بتغيير ذلك كما يلي:

نفس الشيء على RN 0.61.5

لقد وجدت أن الاختبار اليدوي سيكون ناجحًا للغاية ، لذلك كتبت مكونًا لاختبار بعض السيناريوهات التي أبلغ عنها الأشخاص أعلاه تلقائيًا. ستجد المكون أدناه. عليك فقط أن تجعله في مكان ما ليقوم بعمله.

عند القيام بذلك ، وجدت أنك تحتاج فقط إلى إضافة ما يلي إلى AppTheme في styles.xml كما اقترحهHopding
<item name="android:editTextBackground"><strong i="8">@android</strong>:color/transparent</item>

لم يكن هناك حاجة إلى أي شيء آخر ، ولم تكن هناك حاجة إلى تجنب تعيين underlineColorAndroid ، لذلك لا يهم أن تقوم React Native الآن بتعيينها افتراضيًا.

يتمثل الجانب السلبي الرئيسي لهذا الإصلاح في أنه يتعين عليك إعادة تصميم مدخلات النص للسماح بفقدان الحشو الناتج ، كما أنك تفقد سلوك التسطير الفعلي أيضًا ، والذي كان مفيدًا لنا حيث نضعه دائمًا على "شفاف" لتكون متسقة مع iOS. إذا كنت في حاجة إليها ، فيمكنك إنشاء مكون غلاف يشاهد onFocus و onBlur ويصنع تسطيرًا خاصًا بك.

إصداري من React Native هو 0.57.3

فيما يلي بعض الأشياء الأخرى التي وجدتها باستخدام مكون الاختبار الخاص بي:

1. لم أستطع التسبب في الانهيار على الإطلاق على جهازي اللوحي منخفض المواصفات الذي يعمل بنظام Android. كان من السهل جدًا إعادة الإنتاج ولكن على هاتفي Samsung S6 Edge الذي يعمل بنظام Android 7. أعتقد أن هناك حالة سباق تحتاج إلى جهاز أسرع لاستفزازها.
2. لم يُحدث التمرير في مدخلات النص أي فرق ، ويمكنني بسهولة إعادة إنتاج المشكلة دون استخدام ScrollView.
3. لم يكن إدخال النص ضروريًا. كان مجرد تغيير التركيز كافيًا للتسبب في الانهيار.
4. لم يُحدث أي اختلاف في اللون الذي قمت بتعيين التسطير إليه ، حتى أن undefined تسبب في الانهيار ، ولكن ربما تتوقع ذلك نظرًا لأن RN الآن تجعله افتراضيًا على "شفاف"
5. أدى ظهور عدد لا بأس به من مدخلات النص في وقت واحد إلى إحداث فرق مع حدوث الانهيار بشكل أسرع مع 100 ، بدلاً من 10 فقط على الشاشة.
6. لم أتمكن من إعادة إنتاج العطل باستخدام displayForMs: 0 مما يشير إلى أنه يحدث فقط عندما يتم إنشاء مدخلات النص مؤخرًا فقط.

إذا كنت لا ترغب في التسكع أثناء الاختبار ، يمكنك التقاط ناتج adb logcat والبحث عن رسائل وحدة التحكم التي ينتجها المكون وتقرير الأعطال.

هنا هو مكون الاختبار الخاص بي إذا كنت ترغب في استخدامه. تم تعيين معلمات الاختبار لتتسبب في حدوث عطل عادةً في أقل من 30 ثانية بالنسبة لي.

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

يمكن تأكيد هذا إصلاحه بالنسبة لي!

أنا سعيد لأن مكون الاختبار الخاص بي والحل المقترح يعمل من أجلكgagangoku

بالنسبة لأولئك الذين يريدون رؤيته في السياق الرابط هنا

ربما تكون لطيفًا بما يكفي لإضافة هذا الرابط إلى تعليقك.

لقد نجح مكون الاختبار 👏👏👏) ، لكنني واجهت بعض المشاكل على طول الطريق مما قد يساعد روحًا أخرى مفقودة:

تم تجاوز AppTheme الخاص بي بشكل غير صحيح في الملف AndroidManifest.xml ، بسبب خطأ ارتكبه أحد المطورين عند إضافة نشاط شاشة البداية. بمجرد أن أصلحت وتأكدت من استخدام AppTheme بالفعل (على سبيل المثال ، عن طريق تغيير لون النص الافتراضي ورؤيته في التطبيق) ، ثم نجح الإصلاح بالفعل.

شكرا جزيلا ، ونتمنى لك التوفيق هناك!

يحدث لي باستخدام المعرض. أقوم بتشغيل هذا الأمر.
sudo expo start -c واختفت المشكلة.

HakimAsa أقترح استخدام مكون الاختبار للتأكد من أنه ذهب بالفعل.

الشيء الغريب هو أن الكود كان يعمل لمدة شهر بدون هذه المشكلة. ولكن بعد إجراء بعض عمليات إعادة التحميل المتكررة على التغييرات ، واجهت مشكلة بالأمس ... على أي حال سأحاول اقتراحك @ glenn-axsy

في حالتي ، كان ذلك يحدث داخل FlatList عندما يُرجع renderItem <TextInput /> . لذلك قمت بحل هذه المشكلة بإرجاع <><TextInput /></>

MahmoudHemaid ، من الصعب إعادة إنتاج المشكلة لدرجة أنك ربما لم تحلها بالفعل. مزيد من المعلومات هنا .

android.graphics.drawable.Drawable $ Constantstate ، newdrawable عند ظهور خطأ مرجعي فارغ أثناء النقر فوق صورة ، موضوعة في أقصى الزاوية اليمنى. وكانت تلك الصورة بمثابة زر تبديل. أنا أستخدم RN 0.61.2. شخص ما الرجاء مساعدتي في حل المشكلة. يحدث هذا فقط في ملف apk مستقل

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

عند القيام بذلك ، وجدت أنك تحتاج فقط إلى إضافة ما يلي إلى AppTheme في styles.xml كما اقترحهHopding

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

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

سيكون أبسط مثال على ذلك هو إنشاء EditText بسمات نمط AttributeSet فارغة وبدون (0) سمات نمط افتراضية:

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

قد يتم تجاوز ReactTextInput بواسطة الفئات الفرعية التي ترغب في تقديم مثيلها الخاص من EditText .

مُنشئ android EditText :

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

الذي يستدعي مُنشئ View ( مستندات )

سأستمر في التحقيق. شكر

مرحبًا @ glenn-axsy ، لقد كنت أعاني من هذا الأمر لساعات ، لذا آمل حقًا أن تتمكن من مساعدتي. أنا أستخدم AndroidTextInputTest الخاص بك على هاتف Android. أنا أقوم بتشغيل React Native with Typescript إذا كان ذلك مهمًا ، وأقوم بذلك من خلال Expo ، وهذا يعني أنه ليس لدي أي عناصر من نوع EditText.
رد فعل أصلي في package.json = "رد فعل أصلي": "^ 0.61.4"

لقد استخدمت المعلمات:

معلمات const = {
underlineColors: ["أحمر" ، غير محدد ، "شفاف" ، "rgba (0 ، 0 ، 0 ، 0)"] ، // الألوان المراد اختبارها
numberOfInputs: 100 ، // كم عدد إدخال النص المطلوب عرضها في المرة الواحدة
focusIntervalMs: 200 ، // كم مرة يجب تغيير التركيز بينهما
displayForMs: 3000 ، // كم من الوقت يتم عرضها (ضبط على 0 لأجل غير مسمى)
delayDisplayForMs: 10 ، // كم من الوقت للتأخير بين شاشات العرض
withScrollView: false، // ما إذا كنت تريد استخدام ScrollView
} ؛

وكان مخرجي قبل الحصول على "محاولة استدعاء الطريقة الافتراضية" هو:

الاختبار باستخدام المعلمات = {"underlineColors": ["red"، null، "transparent"، "rgba (0، 0، 0، 0)"]، "numberOfInputs": 100، "focusIntervalMs": 200، "displayForMs": 3000 ، "delayDisplayForMs": 10 ، "withScrollView": false}
معلمات التقويم المرئي صحيح والحالة صحيحة
اختبار underlineColor = أحمر
اختبار underlineColor = غير محدد
اختبار underlineColor = شفاف
اختبار underlineColor = rgba (0 ، 0 ، 0 ، 0)
اختبار underlineColor = أحمر
اختبار underlineColor = غير محدد
اختبار underlineColor = شفاف

إذن ، سؤالي من هنا هو ، كيف يمكنني استخدام هذه المعلمات والمخرجات التي رأيتها قبل التعطل لتشخيص الخطأ الذي يحدث في تطبيقي؟

شكرا لك على أي مساعدة على الإطلاق.

ucheNkadiCode إنه اختبار لإعادة

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

ucheNkadiCode إنه اختبار لإعادة

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

sunnylqm أنا

أستخدم إدخال نصي يبدو كالتالي:

إدخال النص
المرجع = {مفتاح}
مفتاح = {مفتاح}
عنصر نائب = {مفتاح}
underlineColorAndroid = {underlineColor}
النمط = {styles.textInput}

شكرا لك

تضمين التغريدة

ولكن بالنسبة للمعرض ، ربما تحتاج إلى الإخراج أولاً لتعديل إعدادات مثل هذه

تضمين التغريدة

ولكن بالنسبة للمعرض ، ربما تحتاج إلى الإخراج أولاً لتعديل إعدادات مثل هذه

نعم ستكون هذه هي القضية بحق. لا أريد أن أدفع ثمن إخراج تطبيق التفاعل الأصلي الخاص بي في وقت مبكر من تطويره. آمل أن أجد حلًا يبقيني في React Native.

شكرا لمساعدتك

تضمين التغريدة

كان تعليقي يعمل في هذا الاتجاه ، لإصلاح هذا في طلب سحب لتجنب المشكلات المرتبطة بـ TextInput prop underlineColorAndroid . يعين ReactNative موضوعًا بطريقة برمجية ... يرجى مراجعة تعليقي والعودة إلي مع بعض التعليقات حيث لم أتمكن من حل هذه المشكلة وأنا أعمل على طلب سحب آخر الآن. شكر

لقد تمكنت بالفعل من حل هذه المشكلة عن طريق إعادة كتابة طريقة التفاعل الأصلية ReactTextInput

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

ولكن هذا هو فقط تعطيل النمط الذي تم تمريره إلى مكون EditText باستخدام getThemedContext()

بالإضافة إلى ذلك ، يخبرنا المكدس أن هذا الخطأ ناتج عن ReactEditText.onTouchEvent ، لذلك عندما يلمس المستخدم المكون TextInput .

كان تعليقي يعمل في هذا الاتجاه ، لإصلاح هذا في طلب سحب لتجنب المشكلات المرتبطة بـ TextInput prop underlineColorAndroid . يعين ReactNative موضوعًا بطريقة برمجية ... يرجى مراجعة تعليقي والعودة إلي مع بعض التعليقات حيث لم أتمكن من حل هذه المشكلة وأنا أعمل على متطلبات سحب أخرى الآن.

لقد تمكنت بالفعل من حل هذه المشكلة عن طريق إعادة كتابة طريقة التفاعل الأصلية ReactTextInput

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

ولكن هذا هو فقط تعطيل النمط الذي تم تمريره إلى مكون EditText باستخدام getThemedContext()

بالإضافة إلى ذلك ، يخبرنا المكدس أن هذا الخطأ ناتج عن ReactEditText.onTouchEvent ، لذلك عندما يلمس المستخدم المكون TextInput .

Almajlliss هههههههههههههه لذلك ليس لدي أي عناصر يمكنني العثور عليها في دليل مشروعي باستخدام ReactEditText وليس لدي أيضًا أي ملفات .java في دليلي. أنا أستخدم TypeScript مع React native لذا فإن غالبية ملفاتي هي .tsx أو .ts باستثناء الكثير من node_modules.

لسوء الحظ ، لا أستخدم Native Android.

ucheNkadiCode لحل هذا الآن تحتاج إلى إخراج ، وإلا أعد إنشاء هذا السيناريو في رد الفعل ، اكتب طلب سحب ، يتم دمجه في رد الفعل الأصلي ثم المعرض لاحقًا.

ucheNkadiCode أخشى أنني لا أستخدم Expo ، لكن يبدو أن sunnylqm يعرف ما يتحدث عنه

لقد واجهت للتو نفس المشكلة في المعرض.
حاولت: watchman watch-del-all && expo r -c
ولكن ما زالت هناك أخبار جيدة.

أواجه نفس المشكلة ، والتي تختفي إذا قمت بتغيير إدخال النص إلى نص.

هذا التعليق من عامين لا يزال ساري المفعول.

لقد قمت بتضييقه إلى <TextInput> يتم عرضه داخل FlatList. عندما استبدل هذا بـ <Text> ، تختفي المشكلة.

يبدو أن إعادة تعيين ذاكرة التخزين المؤقت تساعد لفترة وجيزة ، لكن تطبيقي سيتعطل مرة أخرى بعد بضع نقرات على الأزرار.

اختبار diegoboston باستخدام مكون الاختبار الخاص بي ، يمكنك إعادة إنتاج هذا بدون FlatList. يمكنك العثور على مكون الاختبار والحل / الحل في تعليقي هنا .

أنا أستخدم expo SDK 37 الذي يستخدم التفاعل الأصلي 0.61 داخليًا.
من الغريب أنه لم يكن لدي أي مشكلة على الإطلاق ، ولكن فجأة عندما أعدت تشغيل أداة البناء ، ظهرت هذه المشكلة. هل لم يتم إصلاحه بعد؟

RN 0.62.2 + Android نفسه هنا.
تم استدعاء هذا الخطأ في وضع الإنتاج.

أدى مسح ذاكرة التخزين المؤقت للتطبيق من الإعدادات إلى حل مشكلتي ، لكن هذا لا يبدو حلاً مقبولاً لهذا الأمر.

لقد عملت على هذه المشكلة وهذه هي النتائج التي توصلت إليها (المنشور السابق هنا ).

1) نعلم أن إضافة android:editTextBackground بـ color/transparent إلى السمة يعمل على إصلاح المشكلة

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

2) يؤدي تغيير طريقة ReactEditTextShadowNode createDummyEditText إلى الكود أدناه أيضًا إلى إصلاح المشكلة (يبدو لي أنه يعطل جميع الأنماط لـ EditText)

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

ما أفهمه الآن لهذه المشكلة هو أنه في Android يمكنك تعيين الأنماط بطريقتين

1) كتابة XML مثل عناصر وأنماط html وتطبيقها
2) قم باستدعاء المُنشئ EditText أو View و مرر السياق و السمات / الأنماط الأخرى معه.

يستخدم ReactEditText createDummyEditText لإنشاء مثيل EditText ثم تغيير بعض الأنماط (المساحة المتروكة والتخطيط .. إلخ) ، ولكن هذا شيء متعلق بالتخطيط (المساحة المتروكة ، الهوامش) و لا ألوان الخلفية وما إلى ذلك .. في الحقيقة حاولت تغيير سطور الكود هذه إلى setBackgroundTint إلى red أو transparent ولم تنجح ...

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

يتم تغيير لون الخلفية بالطريقة التالية

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

في يوم الاثنين ، سأحاول مرة أخرى تغيير طريقة setBackgroundColor وتعيين لون الخلفية شفافًا في وقت التشغيل ... سيكون هذا أول دليل لي لحل هذه المشكلة

فشل المكدس على 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 هي آخر طريقة تم استدعاؤها قبل الفشل ، أما باقي المكدس فهو من مكتبة Android sdk OpenSource وليس السبب الحقيقي للمشكلة

من المحتمل أن يكون تعيين android:editTextBackground مجرد تجاوز لبعض قيم العناصر من السمة الافتراضية التي تسبب المشكلة. المشكلة مرتبطة بقيام المُنشئ بتمرير getThemedContext والذي يتضمن أيضًا السمة

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

لهذا السبب أعتقد أنه يجب البحث عن الحل في كيفية تعامل React مع السياق ...

قام الرجال بإعادة تشغيل الحزم ومسح ذاكرة التخزين المؤقت لي!

لكن هذا هو الحل المؤقت كيف يمكنني إصلاح هذا بشكل دائم؟

حاولت أن أضبط برمجيًا في جافا لون الخلفية إلى شفاف ، لكنني ما زلت أتسبب في خطأ وقت التشغيل ، مما يجعلني أصدق الكود أدناه

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

هو مجرد تجاوز المنطق من

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

وهو سبب المشكلة بشكل واضح في المكدس

هذه الطريقة هي المسؤولة عن إعداد أسلوب تحرير النص ،

تكمن المشكلة في أن مكدس المشكلات ReactEditText.onTouchEvent مما يعني أن المستخدم يلمس TextInput ويتم تشغيل الخطأ.

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)

نوع آخر من الأخطاء https://github.com/facebook/react-native/issues/17530#issuecomment -376917781

استثناء فادح: java.lang.NullPointerException: محاولة استدعاء طريقة افتراضية 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable $ ConstantState.newDrawable (android.content.res.Resources)' على مرجع كائن فارغ في android .graphics.drawable.DrawableContainer $ DrawableContainerState.createAllFutures (DrawableContainer.java:875) في android.graphics.drawable.DrawableContainer $ DrawableContainerState.getOpacity (DrawableContainer.java:1158) في android.graphics.drawable.Dgetable : 433) في android.graphics.drawable.InsetDrawable.getOpacity (InsetDrawable.java:258) في android.view.View.computeOpaqueFlags (View.java:16791) في android.view.View.setBackgroundDrawable (View.java:21710) في android.view.View.setBackground (View.java:21603) على android.view.View.(View.java:5547) في android.widget.TextView.(TextView.java:1135) في android.widget.EditText.(EditText.java:107) في android.widget.EditText.(EditText.java:103) في android.widget.EditText.(EditText.java:99) في android.widget.EditText.(EditText.java:95) في com.facebook.react.views.textinput.ReactEditText.(ReactEditText.java:92) على com.facebook.react.views.textinput.ReactTextInputManager.createViewInstance (ReactTextInputManager.java:94) على com.facebook.react.views.textinput.ReactTextInputManager.createTextInputManager.create com.facebook.react.uimanager.ViewManager.createView (ViewManager.java:46) في com.facebook.react.uimanager.NativeViewHierarchyManager.createView (NativeViewHierarchyManager.java:218) في com.facebook.react.uimanager.UIVue $Operation نفذ (UIViewOperationQueue.java:150) على com.facebook.react.uimanager.UIViewOperationQueue $ DispatchUIFrameCallback.dispatchPendingNonBatchedOperations (UIViewOperationQueue.java:923) في com.facebook.react.uimanager.UueiewOiview في com.facebook.react.uimanager.GuardedFrameCallback.doFrame (GuardedFrameCallback.java:31) على com.facebook.react.modules.core.ReactChoreographer $ ReactChoreographerDispatcher.doFrame (ReactChoreog rapher.java:136) في com.facebook.react.modules.core.ChoreographerCompat $ FrameCallback $ 1.doFrame (ChoreographerCompat.java:107) على android.view.Choreographer $ CallbackRecord.run (Choreographer.java:909) على android. view.Choreographer.doCallbacks (Choreographer.java:723) على android.view.Choreographer.doFrame (Choreographer.java:655) على android.view.Choreographer $ FrameDisplayEventReceiver.run (Choreographer.java:897) على android.os.Handler .handleCallback (Handler.java:789) في android.os.Handler.dispatchMessage (Handler.java:98) على android.os.Looper.loop (Looper.java:164) على android.app.ActivityThread.main (ActivityThread. java: 6938) في java.lang.reflect.Method.invoke (Method.java) في com.android.internal.os.Zygote $ MethodAndArgsCaller.run (Zygote.java:327) في com.android.internal.os.ZygoteInit .main (ZygoteInit.java:1374)

على الجانب الآخر ، أسأل نفسي إذا كان https://github.com/facebook/react-native/issues/17530#issuecomment -504044357 مثالاً مقبولاً ، لأنه لا يسبب الخطأ يدويًا بالنقر فوق إدخال النص ولكن بالقيام بذلك برمجيا ..

أنا متأكد من أن شخصًا ما في هذه المناقشة سيجري بحثًا مناسبًا ويحل هذه المشكلة. شكرا جزيلا ونتمنى لك التوفيق! : مبتسم:

يا رفاق ، حاول تشغيل "تثبيت npm" مرة أخرى. عملت معي.

لقد حاولت إضافة <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> وهذا يمنع التطبيق من الانهيار ولكن مربع النص يستمر في الوميض بين الكبير والصغير وغير قابل للاستخدام ، هل كان لدى أي شخص آخر هذا؟

في حالتي ، أستخدم مكونات نمطية ، أضع اسم الدعائم على "صحيح" ، وأعتقد أنه خاص ، وأغير إلى "isRight" لحل مشكلتي.

خذ بناء الإصدار واختبره على ملف apk الذي لم تره من قبل

يشير التعليق الأصلي إلى مشكلة تم الحصول عليها من خلال تقرير خطأ التحليلات ، وليس خطأ في التطوير ، أعتقد أننا بحاجة إلى الاستمرار في التركيز.

يمكنك تجربة كلتا النقطتين وإحدى هاتين النقطتين ، أيهما يناسب تطبيقك:

1. احذف بيانات ذاكرة التخزين المؤقت لتطبيقك واتركه يعيد التحميل
2. أعد تشغيل الخادم باستخدام npm start --reset-cache

https://github.com/facebook/react-native/pull/24183 أحاول تصحيح هذا مرة أخرى.

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

يبدو أن هناك مشكلة ذات صلة افتح https://issuetracker.google.com/issues/37068452 على مشروع Android

1. قم بإنشاء تطبيق Drawable مخصص لا يتجاوز getConstantState ().
2. قم بإنشاء مثيل LayerDrawable ، مع مثيل قابل للرسم المخصص كطفل.
3. نداء متحور () على 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();

في حالتنا ، يتم تشغيل خطأ وقت التشغيل في هذا السطر من ReactEditText (يرث من 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} /> بإرسال المعلومات من وقت تشغيل JavaScript إلى Android مثل JSON من خلال ReactNativeBridge ، وستستخدم واجهة برمجة تطبيقات Android Java المعلومات لإنشاء مثيل View وتضخيمه (عرضه) في الشاشة.

سيمرر كائن Context إلى المُنشئ View الذي سيضخم التخطيط الفاسد لهذا <TextInput /> ، ثم في أي وقت نغير خاصية مثل underlineColorAndroid ، نحن سيستدعي طريقة Android API محددة على سبيل المثال. سيتولى setUnderlineColorAndroid("red") و Android API تحديث <TextInput /> لون التسطير.

إذا كان 37068452 هو الذي تسبب في وقت التشغيل ، فيجب أن نكون mutating() a BackgroundDrawable ربما عن طريق تغيير underlineColor ، لكن الخطأ يظهر في المُنشئ View عندما مررنا Context .

سأحاول تصحيح أخطاء مكدس Android ، لكنني سأحاول أولاً تحويل المثال الحالي إلى مثال أدنى قابل لإعادة الإنتاج وإزالة أي خصائص ليست ضرورية لإعادة إنتاج الخطأ.

لقد تمكنت من إنشاء مثال أدنى يمكن إعادة إنتاجه.
سبب المشكلة هو خاصية مفتاح TextInput.

ستؤدي إعادة عرض عدد كبير من مكونات إدخال النص باستخدام خاصية مفتاح إلى حدوث خطأ في وقت التشغيل.
يبدو أن عدد TextInput s ضروري لبدء الانهيار.

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

لا يتكاثر العطل إذا قمت بإزالة خاصية المفتاح TextInput . سأحقق في الأمر وأحاول إصلاحه. قم بتشغيل هذا المثال لإعادة إنتاجه.

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;

يمكن تكرار المشكلة نفسها مع FlatList ، إذا كان عرضك data يتضمن key ، index أو id مثل هذا [{ key: "1"}, {key: "2"}, .. {key: "5000"}] ، سيتم استخدام key تلقائيًا لقائمتك ويتسبب في وقت التشغيل. تؤدي إزالة هذه المفاتيح من المصفوفة data إصلاح الخطأ وإزالة التخزين المؤقت التلقائي.

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;

يبدو أن سبب المشكلة هو سطر التعليمات البرمجية هذا. لقد علقت على السطر واستبدلت به const key = 500; ولن يتم إعادة إنتاج الخطأ ..

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

مثال على ذلك مع keyExtractor(item, ii) مع item = {"key":"450"} و ii = 50 وقيمة الإرجاع key = 450 سيتسبب في الانهيار ، لكنني أعتقد أن هذا ليس السبب الحقيقي ، ولكن فقط الإشارة إلى أن المفتاح هو سبب المشكلة. سأستمر في البحث في هذا. أنا أبحث عن عمل. شكرا جزيلا. أتمنى لك نهاية أسبوع جيدة.

| مع وقت التشغيل |
|: -------------------------: |
| |

| بدون وقت |
|: -------------------------: |
| |

@ fabriziobertoglio1987 لدي استنتاج مماثل https://github.com/facebook/react-native/issues/17530#issuecomment -573934341 ، أي متعلق بإعادة التركيب / إنشاء نص محرّر. في ذلك الوقت ، لم أفهم سبب إعادة إنشاء / إعادة إدخال النص عندما بدا أنه ليس لديهم سبب لذلك. الآن يبدو أن المفاتيح قد تكون السبب.

يلقى الخطأ من هنا

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

حيث أن المصفوفة mDrawableFutures ليست خالية ولكن بعض عناصرها الفرعية يمكن أن تكون خالية.

لا يمكن استنساخ mDrawableFutures إلا من الآخرين

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

مما يعني أنه لم يكن فارغًا عندما تم استنساخه ولكن بطريقة ما تم تدمير بعض العناصر التابعة له بعد ذلك.
ما يلي هو تخميني: ستؤدي الدعائم الرئيسية إلى تشغيل عملية مختلفة ، والتي من شأنها إنشاء عقد ظل لمدخلات النص. وأثناء العملية يتم استنساخ الدول القابلة للرسم. ومع ذلك ، قد تكون هناك حالة سباق / عملية غير آمنة لمؤشر الترابط أدت إلى تدمير بعض الحالات القابلة للرسم بينما لا تزال قيد الاستخدام. يارب احفظها

شكرًا جزيلاً sunnylqm ، أنا أؤمن بقوة التعاون

أعتقد أن المشكلة مرتبطة ببعض المعلمات القذرة التي تم تمريرها عند استخدام key و 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

أنت محق ، في الواقع هذه المشكلة تحدث فقط عند استخدام مكون TextInput . على سبيل المثال ، استبدال TextInput بـ Text في renderItem سيصلح هذه المشكلة

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

الفرق بين استخدام Text و TextInput هو أن const element سيكون ForwardRef TextInput . في الحالة أدناه ، ينشئ TextInput وقت تشغيل عندما يصل إلى مفتاح معين. لقد قمت أيضًا بإزالة underlineColorAndroid="transparent" وهو ليس سبب الخطأ ، لكنني تركته في السجلات أدناه.

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 بإرجاع 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

أعتقد أنه يتم استدعاء طريقة في Java API من واجهة برمجة تطبيقات جافا سكريبت TextInput ولكن مع معلمات مفقودة / قذرة. قد يتسبب هذا في حدوث خطأ وقت تشغيل NPE ، لكني بحاجة إلى التحقق من كل جانب من جوانب واجهة برمجة تطبيقات JS TextInput لفهم السبب.

أعتقد أن الخاصية key تسبب مشاكل لأن آلية React تعتمد على مقارنة الخاصية key ، إذا لم تكن آلية الخاصية key موجودة ، فلن يتم التخزين المؤقت وبالتالي لا يوجد خطأ .

سأحاول غدًا تعيين نقطة توقف في الرمز الذي أشرت إليه في الرسالة أعلاه

شكرا جزيلا للمساعدة. نأمل أن نتمكن من كتابة طلب سحب معًا وإصلاح هذه المشكلة. أتمنى لك مساءا سعيدا. فابريزيو

تضمين التغريدة

طويلة جدا لا تقرأ

أنا أكتب طلب سحب لإصلاح هذه المشكلة. من السهل جدا الإصلاح.

سبب المشكلة هو BackgroundDrawable الافتراضي المستخدم في تهيئة EditText

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

The Drawable هو المظهر من السمة التي نستخدمها Theme.AppCompat.Light.NoActionBar . يمكن إجراء تغيير Drawable عن طريق تغيير ملفات xml النموذجية المستخدمة لتهيئة مشروع android الذي يتفاعل مع التفاعل الأصلي باستخدام برنامج نصي للتفاعل الأصلي

سأستخدم إما واحدًا يتم توفيره افتراضيًا من android أو سأقوم بإنشاء قابل للرسم مخصص وإدراجه في كل تهيئة للمشروع.

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>

أو

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>

نسخة طويلة

أقتبس من sunnylqm https://github.com/facebook/react-native/issues/17530#issuecomment -660506001

ما يلي هو تخميني: ستؤدي الدعائم الرئيسية إلى تشغيل عملية مختلفة ، والتي من شأنها إنشاء عقد ظل لمدخلات النص. وأثناء العملية يتم استنساخ الدول القابلة للرسم. ومع ذلك ، قد تكون هناك حالة سباق / عملية غير آمنة لمؤشر الترابط أدت إلى تدمير بعض الحالات القابلة للرسم بينما لا تزال قيد الاستخدام.

هذا السطر android:editTextBackground يصلح الخطأ ، لكن ماذا يفعل هذا السطر في ReactNative؟

1) يقوم AndroidManifest.xml بتعيين 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) نقوم بتغيير AppTheme في 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 سيستدعي المُنشئ super(context) . يتضمن الكائن context layout و theme ( AppTheme ).

سيحصل المُنشئ View على معلومات النمط / السمة / التخطيط من الكائن context وإنشاء مثيل EditText بهذه الأنماط (xml مثل html) ، قم بتضخيمه و اعرضه على الشاشة.

يستخدم Android xml مثل html لتقديم طرق عرض ثابتة ، بينما تستخدم Java لعرض المحتوى الديناميكي (مثل JavaScript في الويب).

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

4) ReactNative إنشاؤه فوق واجهة برمجة تطبيقات Context ، لكنه سيستخدم نفس النمط من 1-3.
ابدأ العروض باستخدام الكائن context ، ثم استخدم JavaScript لإجراء تغييرات ديناميكية دون تغيير مثيل context مباشرةً ، ولكن باستخدام جسر react-native عبر واجهة برمجة تطبيقات Android.

| قبل | بعد | بعد مع دعائم نمط إدخال النص |
|: -------------------------: |: -------------------- -----: |: -------------------------: |
| | | |

أقوم بإعداد طلب سحب لتغيير Drawable الافتراضي المستخدم في EditText عند التهيئة.
يتسبب Drawable from Theme Theme.AppCompat.Light.NoActionBar في حدوث هذه المشكلة ، ويجب استبداله <strong i="27">@android</strong>:drawable/edit_text مرتفع جدًا بالنسبة لتصميمنا. يتكيف العرض الرئيسي مع الارتفاع الافتراضي القابل للرسم إذا كان الارتفاع أكبر من الارتفاع الرئيسي. أعتقد أن ReactNative تستخدم أداة رسم افتراضية ذات ارتفاع منخفض ثم تقوم بتكييفها مع match_parent للعرض الأصلي.

1) الخيار 1 - ابحث عن عنصر قابل للرسم من موضوع آخر

2) الخيار 2
أنشئ رسمًا جديدًا في نموذج التفاعل الأصلي بناءً على واحد متاح في مشروع android بارتفاع منخفض لكل طريقة عرض match_parent.

أضفت إلى مشروع Android الخاص بي ما يلي قابل للرسم بارتفاع قليل من البكسل

تتكيف الخلفية القابلة للرسم مع ارتفاع عرض والده البالغ 10

الخلفية القابلة للرسم تتكيف مع ارتفاع عرض والده البالغ 100

يبدو أنه يعمل مع عناصر رسومية صغيرة في الخلفية ، فنحن نحتاج فقط إلى البرنامج النصي react-native init لتهيئة المشاريع باستخدام هذه الخلفية القابلة للرسم افتراضيًا. سأضيف التغييرات التوضيحية أعلاه إلى الملفات أدناه في طلب سحب.

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

شكرا جزيلا. فابريزيو

تواجه نفس المشكلة مع RN 0.61.0 + Android API المستوى 28.
لقد قمت بتضييقه إلى مجموعة من قوائم Flatlist و TextInput وعروض المكون المتداخلة

@ fabriziobertoglio1987 لقد جربت بهذه الطريقة ولكن ربما فاتني شيء لأنني لم أجعلها تعمل. أعرف القليل عن android ويسعدني أنه يمكنك إصلاحه. بينما ما زلت مهتمًا بمسألة الدعائم الرئيسية.

@ fabriziobertoglio1987 هل هناك على أي حال في رد فعل كود js الأصلي الذي يمكنني إضافته لإصلاح هذه المشكلة بسرعة؟ دعني اعرف.

@ asmi24886 ، يمكنك العثور على مكون اختبار لإعادة إنتاج هذه المشكلة بشكل موثوق ورمز أصلي / حل بديل للتكوين في تعليقي هنا
لا أعتقد أن هناك حلًا بديلًا باستخدام كود JS فقط.

هذا هو استمرار لرسالتي السابقة https://github.com/facebook/react-native/issues/17530#issuecomment -660908150 ، جهودي للعثور على وظيفة مستقلة وكتابة طلب السحب لإغلاق هذه المشكلة.

لقد قمت بإنشاء رسم مخصص بناءً على 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>

يحدث وقت التشغيل من الإدخال التالي ، إذا قمت بإزالة هذا السطر نسخة طبق الأصل من Drawable الحالي من react-native يعمل ولم يتم تشغيل خطأ وقت التشغيل. لقد قمت بتضمين المثال الأدنى لإعادة الإنتاج في 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"/>

أنا أكتب طلب سحب ، بمجرد دمج طلب السحب ، ستتمكن من الترقية باستخدام مساعد الترقية .

سيتضمن طلب السحب نسخة من هذه السيناريوهات في تطبيق RNTester ، وتغييرات في القالب وإضافة الرسم المخصص أعلاه لتجنب هذه المشكلة.

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

هذا فيديو يعرض خطأ وقت التشغيل عندما يحتوي Drawable على السطر <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

هذا فيديو يعرض الإصلاح (لا يوجد خطأ في وقت التشغيل) عندما لا يحتوي Drawable على السطر <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>

كما هو معروض في لقطة الشاشة أدناه ، أقوم فقط بإزالة السطر التالي من ملف xml القابل للرسم
xml <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
أنا لا أغير الأسلوب. الملف القابل للرسم هو نفسه المستخدم من AppCompat وسيكون النمط هو نفسه ، لكنه لن يؤدي إلى ظهور خطأ وقت التشغيل

سأحاول نشر طلب السحب غدًا .

شكرًا جزيلاً sunnylqm على التعاون معي لكتابة https://github.com/facebook/react-native/pull/29452 الذي يحل هذه المشكلة.

يبدو أن هناك خطأ في Drawable.mutate () في بعض الأجهزة / إصدارات نظام التشغيل android حتى بعد التحقق من الحالة الثابتة. يصعب إعادة إنتاج هذا الخطأ وإصلاحه ، لذا حاول فقط التقاط الاستثناء لمنع التعطل.

سبب المشكلة هو هذا السطر في 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"/>

ينشئ السطر أعلاه StateListDrawable والذي سيغير صورة الخلفية TextInput ( قابلة للرسم في الخلفية) اعتمادًا على حالة TextInput

سيؤدي state_pressed="false" و state_focused="false" إلى تغيير TextInput BackgroundDrawable. الصور ليست سبب المشكلة ، لكني قمت بتضمينها لأغراض التوثيق.

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

داخل DrawableContainer.getChild () متغير ConstantState cs هو null . يؤدي استدعاء null.newDrawable(mSourceRes) تشغيل استثناء مؤشر فارغ. هذا الاستدعاء هو نتيجة لتغيير حالة إدخال النص ، في تتبع المكدس هذا بعد الضغط عليه.

لا يتضمن mDrawableFutures قائمة الإدخالات الصحيحة https://github.com/facebook/react-native/pull/29452#issuecomment -662616018.

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

مزيد من المعلومات في التعليقات السابقة 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/ رد فعل أصلي / قضايا / 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

شكرا جزيلا
أتمنى لك يوما طيبا
فابريزيو

@ fabriziobertoglio1987 هل التعليق أعلاه عبارة عن حل بديل أو إصلاح قابل للتنفيذ فعليًا يحتاج إلى إضافته للتفاعل مع المحتوى الأصلي ، فنحن حاليًا على RN 0.59.3 ونحصل على هذا الخطأ فقط في استخدام الإنتاج. لا يبدو أننا ننسخ في التنمية.

Coffeegerm التعليق أعلاه https://github.com/facebook/react-native/issues/17530#issuecomment -662000718 هو شرح موجز لكيفية طلب السحب https://github.com/facebook/react-native/pull / 29452 يعمل على إصلاح هذه المشكلة. بمجرد دمج طلب السحب في رد فعل أصلي

1) التطبيقات الجديدة لن يكون بها هذا الخطأ
2) ستتم ترقية التطبيقات الحالية ولن تواجه الخطأ. اقرأ المزيد حول الترقية عند ترقية ملفات # 3-Upgrade-your-project-files لمعرفة المزيد حول كيفية تطبيق التغييرات في مجلد /android عند ترقية التطبيق الخاص بك.

إذا كنت لا ترغب في الترقية ، يمكنك التحقق من العلاقات العامة الخاصة بي https://github.com/facebook/react-native/pull/29452 وإضافة هذه التغييرات إلى مجلد مشروعك android . لست بحاجة إلى إجراء تغييرات على الرمز المصدر react-native ، حيث إن تغييرات التكوين من هذا PR ليست في قاعدة كود Java /ReactAndroid ، ولكن في نموذج Android المستخدم للتهيئة المشروع.

أنا أعمل حاليًا على مشكلات أخرى ، لكنني سأعود وأرد على أي تعليقات وأجري أي تحسينات ضرورية على طلب السحب الخاص بي.

يرجى الرجوع إلي مع أي اقتراح للتحسين وردود الفعل.

أتمنى لك نهاية أسبوع جيدة
شكرا جزيلا لمساعدتكم
فابريزيو

رأيت للتو التزامًا يبدو مرتبطًا https://github.com/facebook/react-native/commit/1e4d8d902daca8e524ba67fc3c1f4b77698c4d08

كنا ننشئ عددًا كبيرًا جدًا من عمليات الإنشاء + الحذف التي كانت زائدة عن الحاجة ويمكن أن تتسبب في مشكلات تناسق أو أعطال أو أخطاء في الأنظمة الأساسية التي لا تتعامل مع ذلك بأمان -
خاصة وأن ترتيب "إنشاء + حذف" غير مضمون (يمكن إنشاء طريقة عرض معاد تحديدها "أولاً" ثم قد يؤدي الاختلاف لاحقًا إلى "حذف" لنفس طريقة العرض).

يارب احفظها

هل لديك أي فكرة عن كيف يمكن لشخص ما حل هذه المشكلة أثناء استخدام Expo ، وبالتالي دون الوصول إلى مجلد android الخاص بالمشروع؟ 😅

divonelnc هناك حل بديل: استخدم مفتاحًا جديدًا في كل مرة يتم فيها تقديم إدخال نصي ، على سبيل المثال ،

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

وبالطبع قد يسبب بعض المشاكل الأخرى وفقدان الأداء.

sunnylqm للأسف هذا لم يساعد. ما زلت أتعرض للتحطم بشكل عشوائي على الشاشة مع العشرات من مدخلات النص.

يمكنني تأكيد هذه المشكلة في الإنتاج! RN: 0.62.2 😕

حدثت نفس المشكلة في RN 0.63.2 :(

قد يؤدي هذا الالتزام إلى إصلاح هذه المشكلة:
https://github.com/facebook/react-native/commit/a5b5d1a805a9c54d325763b432be1cf2c8811dc9

نفس المشكلة مع Expo و RN sdk https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz

واو كان هذا محبطًا. WilliamAlexanderHopding يعمل الحل. أعلم لأنه يمكنني أن أنوب عنه في كل مرة من قبل.
// 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>

إليك حل جيد جدًا. أنشئ غلافًا لأي مكون إدخال نص تستخدمه ، وأنشئ مفتاحًا له باستخدام useMemo. بهذه الطريقة ، سيكون لإدخال نص واحد دائمًا نفس المفتاح من خلال عمليات إعادة العرض ، ولن تضطر إلى كتابة مفاتيح لجميع إدخالات النص أيضًا.

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

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

إذا كنت تستخدم المعرض
حصلت على هذا الخطأ بعد الترقية من expo SDK 38 إلى 39.
اضطررت إلى تنظيف ذاكرة التخزين المؤقت للمعرض (expo -rc) + ذاكرة التخزين المؤقت لتطبيق expo للجوّال (قمت بإلغاء تثبيتها وإعادة تثبيتها للتأكد) واختفى الخطأ.

dpnick من الصعب جدًا إعادة إنتاج الخطأ. أقترح استخدام مكون الاختبار الذي نشرته هنا للتأكد من أنه ذهب بالفعل.

تلقيت هذا الخطأ في الإنتاج ولا يمكنني إعادة إظهار هذه المشكلة ، إصدار RN الخاص بي هو 0.62.2 ، وإليك سجلاتي من firebase Cracklytics:

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 من الصعب جدا إعادة إنتاج الخطأ. هل جربت مكون الاختبار الذي نشرته هنا ؟

لقد كتبت طلب سحب يعمل على إصلاح هذه المشكلة https://github.com/facebook/react-native/issues/17530#issuecomment -663577143

يرجى التوجه إلى الرابط https://github.com/facebook/react-native/pull/29452 اتبع الإرشادات https://github.com/facebook/react-native/wiki/Building-from-source#publish - نسختك الخاصة من رد الفعل الأصلي واسمحوا لي أن أعرف إذا كنت بحاجة إلى أي مساعدة. سأحاول التحقق في عطلة نهاية الأسبوع هذه إذا كانت هناك حاجة إلى كتابة علاقات عامة منفصلة للمعرض ، لكنني أعتقد أنهم سيحصلون فقط على الإصلاح من خلال ترقية رد الفعل بمجرد دمج هذا العلاقات العامة وإصداره. شكرا جزيلا. اتمنى لك ليلة سعيدة

مزيد من المعلومات في مشاركاتي السابقة https://github.com/facebook/react-native/issues/17530#issuecomment -662000718

نفس المشكلة في الإصدار "react-native": "0.63.3"

ما عليك سوى مسح ذاكرة التخزين المؤقت الخاصة بـ Expo في تطبيق الهاتف المحمول (إذا كنت تستخدم تطبيق الهاتف المحمول) أو ذاكرة التخزين المؤقت لتطبيق Expo في أي نظام أساسي تستخدمه.

@ tzeneng96 طيب ، مسح ذاكرة التخزين المؤقت يعمل مع التطبيق ، لكنه ليس حلاً مقبولاً ، لأن المشكلة تتكرر!

AbdelkhalekESI من الصعب جدا إعادة إنتاج الخطأ. هل جربت مكون الاختبار الذي نشرته هنا ؟

لقد تمكنت من إعادة إنتاج هذا الخطأ باستخدام هذا المكون. لقد تلقيت أيضًا العديد من السجلات لهذا الانهيار في الإنتاج. المشروع حاليا لديه رد فعل في الإصدار 0.63.3.

لا أعرف ما إذا كنت قد فهمت الأمر بشكل خاطئ ، ولكن في هذا الموضوع اقتبس من قبل @ glenn-axsy ، مما أفهم أنهم تمكنوا من حله عن طريق إضافة andoid \ app \ src \ main \ res \ values ​​\ styles.xml البند:
"item name =" android: editTextBackground "> @ android: color / transparent / item"

ما زلت أختبر الحل.

thiagocristianno فهمك صحيح ، رغم أنه ليس حلاً مثاليًا وأعتقد أنه لا يساعد مطوري إكسبو لأنهم لا يستطيعون التحكم في هذا الإعداد.

واو كان هذا محبطًا. WilliamAlexanderHopding يعمل الحل. أعلم لأنه يمكنني أن أنوب عنه في كل مرة من قبل.
// 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 أين رأيت الحل؟

واو كان هذا محبطًا. WilliamAlexanderHopding يعمل الحل. أعلم لأنه يمكنني أن أنوب عنه في كل مرة من قبل.
// 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 أين رأيت الحل؟

bobowinca هذا خيط طويل للغاية وقد

jordangrant ، Doh! انظر دائما قبل السؤال. لقد فشلت. شكرا لك سيدي.

يبدو أيضًا أنك تمكنت من إعادة إظهار المشكلة باستمرار. أنا أتساءل كيف تفعل ذلك. لقد رأيت فقط تتبع المكدس حتى الآن. أنا أكتشف طرق للتحقق من الإصلاح.

bobowinca ، يجب أن يساعدك مكون الاختبار الذي نشرته هنا على إعادة إنتاجه باستمرار.

bobowinca ، يجب أن يساعدك مكون الاختبار الذي نشرته هنا على إعادة إنتاجه باستمرار.

يعمل كالسحر! شكرا جلين!

تعمل إضافة <item name="android:editTextBackground"><strong i="5">@android</strong>:color/transparent</item> إلى styles.xml!
كانت طريقة الإضافة إلى TextInput key={Math.random().string()} تعمل ولكن عمليات إعادة العرض تتسبب في إخفاء لوحة المفاتيح في كل مرة بعد ثانية - كان ذلك غير مقبول.