CardField widget displaying as blank on Android #1383

casumatt · 2023-08-23T23:24:23Z

Describe the bug
Our Flutter app uses: flutter_stripe: ^9.1.1. We use the CardField widget. It has been working perfectly, except we now have a user who has experienced the CardField widget as blank, instead of the little credit card icon, and the hint/label text. We have minimum sdk set as 21. I notice that when I am debugging (and the CardField is working) I still see some items in the debug log as per this link: #219, it doesnt seem to impact the CardField widget for me, but may be the cause of the issue for the user.

To Reproduce
I haven't been able to reproduce the error, but I have attached a screenshot. The user has cleared app cache, uninstalled and reinstalled app, etc, etc. I have added a screenshot of the experience.

Expected behavior
The CardField widget appears normally.

Smartphone / tablet

Device: Android device
OS: Android
Package version: 9.1.1
Flutter version 3.10.6

Additional context
Screenshot attached.

remonh87 · 2023-08-24T07:22:26Z

do you know the customers device and android version? To manage expectations I do not think there is much we can do if there is no suitable reproducition step

LScodeblack · 2023-08-24T14:01:12Z

Device is in dark mode, switch it and it will show

casumatt · 2023-08-28T06:18:32Z

@LScodeblack legend, thank you!

casumatt · 2023-08-29T01:30:12Z

@LScodeblack so thank you, dark mode is definitely the issue, but I imagined that darkmode was just making the text 'white', and the only issue was that the user couldn't see the prompts to type in their card details, but in actual fact it does cause CardField to error as per below....

D/EGL_emulation(27919): app_time_stats: avg=4219.07ms min=4219.07ms max=4219.07ms count=1
D/EGL_emulation(27919): app_time_stats: avg=8445.60ms min=129.63ms max=24780.09ms count=3
2
[log] NetworkConnectionManagerWrapper: ConnectivityResult.wifi
I/au.com.casu(27919): NativeAlloc concurrent copying GC freed 43200(1610KB) AllocSpace objects, 10(392KB) LOS objects, 49% free, 9236KB/18MB, paused 907us,112us total 347.656ms
D/EGL_emulation(27919): app_time_stats: avg=629.38ms min=130.39ms max=1540.05ms count=3
D/EGL_emulation(27919): app_time_stats: avg=296.18ms min=17.72ms max=1497.63ms count=6
E/Surface (27919): freeAllBuffers: 1 buffers were freed while being dequeued!
W/au.com.casu(27919): Suspending all threads took: 19.332ms
E/Surface (27919): getSlotFromBufferLocked: unknown buffer: 0x7a95a1643a70
I/au.com.casu(27919): NativeAlloc concurrent copying GC freed 5561(309KB) AllocSpace objects, 4(144KB) LOS objects, 49% free, 9200KB/17MB, paused 1.610ms,19.690ms total 331.538ms
[log] Assessing profile completeness for the current user when the current user is not admin.
[log] The employer's profile has been checked as: true
[log] About to write matches 5
E/MethodChannel#flutter/platform_views(27919): Failed to handle method call
E/MethodChannel#flutter/platform_views(27919): android.view.InflateException: Binary XML file line #23 in au.com.projectname:layout/stripe_card_input_widget: Binary XML file line #23 in au.com.projectname:layout/stripe_card_input_widget: Error inflating class
E/MethodChannel#flutter/platform_views(27919): Caused by: android.view.InflateException: Binary XML file line #23 in au.com.casu:layout/stripe_card_input_widget: Error inflating class
E/MethodChannel#flutter/platform_views(27919): Caused by: java.lang.reflect.InvocationTargetException
E/MethodChannel#flutter/platform_views(27919): at java.lang.reflect.Constructor.newInstance0(Native Method)
E/MethodChannel#flutter/platform_views(27919): at java.lang.reflect.Constructor.newInstance(Constructor.java:343)
E/MethodChannel#flutter/platform_views(27919): at android.view.LayoutInflater.createView(LayoutInflater.java:858)

Is there an actual fix to this so that it works in Dark mode?

guidotheelen · 2023-10-16T18:04:46Z

Also encountered this issue.

The CardField breaks when running the Android device in darkmode.
The CardFormField breaks in a similar way on Android regardless of the theme mode.

Specs:
Flutter: 3.13
flutter_stripe: 9.4.0
Android version: 11
Device: Pixel 4

Anything we can do to fix it?

Stacktrace breaking CardFormField

E/flutter (18790): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(error, Binary XML file line #5 in com.signify.lumxpert.dev:layout/stripe_card_form_view: Binary XML file line #5 in com.signify.lumxpert.dev:layout/stripe_card_form_view: Error inflating class , null, android.view.InflateException: Binary XML file line #5 in com.signify.lumxpert.dev:layout/stripe_card_form_view: Binary XML file line #5 in com.signify.lumxpert.dev:layout/stripe_card_form_view: Error inflating class

yussifm · 2023-12-08T10:53:20Z

Am also facing the same issues here.

yussifm · 2023-12-08T11:46:09Z

It works on emulators but not on real devices

remonh87 · 2023-12-20T19:36:57Z

This should be fixed from version 9.6.0.

kekko7072 · 2024-01-04T10:21:52Z

@remonh87 I'm facing this issue with flutter_stripe: 10.0.0 running only in release mode for android. I have tested also the example app and it's also has the issue. Try running release mode with flutter 3.16.5 and Card Field Themes of the example.

Here a video using example app in flutter run --release:

IMG_5147.mov

remonh87 · 2024-01-04T11:30:58Z

@kekko7072 cannot see the video. Can you give me more info because for me it runs without issues on my pixel. There should be some logs in logcat

kekko7072 · 2024-01-04T12:30:36Z

Sorry @remonh87 here the video and logs.
Video:

IMG_5148.MOV

Logs:

✓  Built build/app/outputs/flutter-apk/app-release.apk (17.3MB).

Flutter run key commands.
h List all available interactive commands.
c Clear the screen
q Quit (terminate the application on the device).
E/flutter (30569): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: PlatformException(error, Binary XML file line #39 in com.flutter.stripe.example:layout/stripe_card_input_widget: Binary XML file line #39 in com.flutter.stripe.example:layout/stripe_card_input_widget: Error inflating class com.google.android.material.textfield.TextInputLayout, null, android.view.InflateException: Binary XML file line #39 in com.flutter.stripe.example:layout/stripe_card_input_widget: Binary XML file line #39 in com.flutter.stripe.example:layout/stripe_card_input_widget: Error inflating class com.google.android.material.textfield.TextInputLayout
E/flutter (30569): Caused by: android.view.InflateException: Binary XML file line #39 in com.flutter.stripe.example:layout/stripe_card_input_widget: Error inflating class com.google.android.material.textfield.TextInputLayout
E/flutter (30569): Caused by: java.lang.reflect.InvocationTargetException
E/flutter (30569): 	at java.lang.reflect.Constructor.newInstance0(Native Method)
E/flutter (30569): 	at java.lang.reflect.Constructor.newInstance(Constructor.java:343)
E/flutter (30569): 	at android.view.LayoutInflater.createView(LayoutInflater.java:852)
E/flutter (30569): 	at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:1004)
E/flutter (30569): 	at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:959)
E/flutter (30569): 	at android.view.LayoutInflater.rInflate(LayoutInflater.java:1121)
E/flutter (30569): 	at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:1082)
E/flutter (30569): 	at android.view.LayoutInflater.rInflate(LayoutInflater.java:1124)
E/flutter (30569): 	at android.view.LayoutInflater.inflate(LayoutInflater.java:654)
E/flutter (30569): 	at android.view.LayoutInflater.inflate(LayoutInflater.java:532)
E/flutter (30569): 	at android.view.LayoutInflater.inflate(LayoutInflater.java:479)
E/flutter (30569): 	at n9.l.c(SourceFile:1)
E/flutter (30569): 	at com.stripe.android.view.j0.<init>(SourceFile:1)
E/flutter (30569): 	at com.stripe.android.view.j0.<init>(SourceFile:2)
E/flutter (30569): 	at p8.p.<init>(SourceFile:1)
E/flutter (30569): 	at p8.q.c(SourceFile:1)
E/flutter (30569): 	at e5.h.<init>(SourceFile:1)
E/flutter (30569): 	at e5.i.a(SourceFile:1)
E/flutter (30569): 	at io.flutter.plugin.platform.e0.M(SourceFile:1)
E/flutter (30569): 	at io.flutter.plugin.platform.e0$a.b(SourceFile:1)
E/flutter (30569): 	at je.l$a.c(SourceFile:1)
E/flutter (30569): 	at je.l$a.d(SourceFile:1)
E/flutter (30569): 	at ke.i$a.a(SourceFile:1)
E/flutter (30569): 	at ce.c.h(SourceFile:1)
E/flutter (30569): 	at ce.c.i(SourceFile:1)
E/flutter (30569): 	at ce.c.e(SourceFile:1)
E/flutter (30569): 	at ce.b.run(SourceFile:1)
E/flutter (30569): 	at android.os.Handler.handleCallback(Handler.java:938)
E/flutter (30569): 	at android.os.Handler.dispatchMessage(Handler.java:99)
E/flutter (30569): 	at android.os.Looper.loop(Looper.java:250)
E/flutter (30569): 	at android.app.ActivityThread.main(ActivityThread.java:7806)
E/flutter (30569): 	at java.lang.reflect.Method.invoke(Native Method)
E/flutter (30569): 	at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:592)
E/flutter (30569): 	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:958)
E/flutter (30569): Caused by: java.lang.IncompatibleClassChangeError: Class 'android.content.res.XmlBlock$Parser' does not implement interface 'th.a' in call to 'int th.a.next()' (declaration of 'androidx.core.content.res.c' appears in /data/app/~~KFM4rXT314r-Vw_5R-kvCw==/com.flutter.stripe.example-p16mJ944pKy_dMQi5bt9IQ==/base.apk)
E/flutter (30569): 	at androidx.core.content.res.c.a(SourceFile:1)
E/flutter (30569): 	at androidx.core.content.res.h.k(SourceFile:1)
E/flutter (30569): 	at androidx.core.content.res.h.d(SourceFile:1)
E/flutter (30569): 	at androidx.core.content.a.c(SourceFile:1)
E/flutter (30569): 	at g.a.a(SourceFile:1)
E/flutter (30569): 	at x6.c.b(SourceFile:1)
E/flutter (30569): 	at com.google.android.material.textfield.z.i(SourceFile:1)
E/flutter (30569): 	at com.google.android.material.textfield.z.<init>(Unknown Source:63)
E/flutter (30569): 	at com.google.android.material.textfield.TextInputLayout.<init>(SourceFile:2)
E/flutter (30569): 	at com.google.android.material.textfield.TextInputLayout.<init>(SourceFile:1)
E/flutter (30569): 	... 34 more
E/flutter (30569): )
E/flutter (30569): #0      StandardMethodCodec.decodeEnvelope (package:flutter/src/services/message_codecs.dart:651)
E/flutter (30569): #1      MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:322)
E/flutter (30569): <asynchronous suspension>
E/flutter (30569): #2      ExpensiveAndroidViewController._sendCreateMessage (package:flutter/src/services/platform_views.dart:1081)
E/flutter (30569): <asynchronous suspension>
E/flutter (30569): #3      AndroidViewController.create (package:flutter/src/services/platform_views.dart:804)
E/flutter (30569): <asynchronous suspension>
E/flutter (30569):

kekko7072 · 2024-01-04T15:42:24Z

Here flutter doctor

[!] Flutter (Channel stable, 3.16.5, on macOS 14.2.1 23C71 darwin-arm64, locale it-IT) • Flutter version 3.16.5 on channel stable at /Users/francescovezzani/Developer/flutter ! Warning: `dart` on your path resolves to /opt/homebrew/Cellar/dart/3.2.4/libexec/bin/dart, which is not inside your current Flutter SDK checkout at /Users/francescovezzani/Developer/flutter. Consider adding /Users/francescovezzani/Developer/flutter/bin to the front of your path. • Upstream repository https://github.com/flutter/flutter.git • Framework revision 78666c8dc5 (2 weeks ago), 2023-12-19 16:14:14 -0800 • Engine revision 3f3e560236 • Dart version 3.2.3 • DevTools version 2.28.4 • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
• Android SDK at /Users/xxy/Library/Android/sdk
• Platform android-34, build-tools 34.0.0
• Java binary at: /Applications/Android
Studio.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build
17.0.7+0-17.0.7b1000.6-10550314)
• All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.2)
• Xcode at /Applications/Xcode-15.2.0-Beta.app/Contents/Developer
• Build 15C5500c
• CocoaPods version 1.14.3

[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build
17.0.7+0-17.0.7b1000.6-10550314)

[✓] VS Code (version 1.85.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.50.0

[✓] Connected device (6 available)
• motorola one action (mobile) • xx •
android-arm64 • Android 11 (API 30)
• iPhone di Mara (mobile) • 00008030-000E09082130C02E • ios
• iOS 17.2.1 21C66
• iPhone di Francesco (mobile) • xx • ios
• iOS 17.2.1 21C66
• iPhone 15 Pro (mobile) •xx • ios
• com.apple.CoreSimulator.SimRuntime.iOS-17-2 (simulator)
• macOS (desktop) • macos •
darwin-arm64 • macOS 14.2.1 23C71 darwin-arm64
• Chrome (web) • chrome •
web-javascript • Google Chrome 120.0.6099.129
! Error: Browsing on the local area network for Francesco’s Apple Watch. Ensure
the device is unlocked and discoverable via Bluetooth. (code -27)
! Error: Browsing on the local area network for Apple Vision Pro. Ensure the
device is unlocked and attached with a cable or associated with the same local
area network as this Mac. (code -27)
! Error: Browsing on the local area network for iPad di Francesco. Ensure the
device is unlocked and attached with a cable or associated with the same local
area network as this Mac.
The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources
• All expected network resources are available.

! Doctor found issues in 1 category.

remonh87 · 2024-01-08T19:14:51Z

@kekko7072 this has to do with the fact that you do not follow the installation guidelines for the theme. Can you make sure you apply these settings and try it again?

kekko7072 · 2024-01-08T19:20:23Z

@kekko7072 this has to do with the fact that you do not follow the installation guidelines for the theme. Can you make sure you apply these settings and try it again?

@remonh87 thanks for the response. I tested the example app of the flutter_stripe package and in debug mode it is working but in release mode it's not, like my own app.

I followed and added all setup requirements, i think it's something broke in release mode.

remonh87 · 2024-01-08T20:13:34Z

@jonasbark I can reproduce it in the example app. Can you have a look at it? Seems like something broke in the last sync.

jonasbark · 2024-01-10T13:30:52Z

I was able to reproduce it as well, but have not found a solution. Only (bad) workaround would be to disable minification and resource shrinking during release builds:

    buildTypes {
        release {
            // TODO: Add your own signing config for the release build.
            // Signing with the debug keys for now, so `flutter run --release` works.
            signingConfig signingConfigs.debug
            minifyEnabled false
            shrinkResources false

            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"

        }
    }

It's likely a proguard issue, but I have not found the entries to add as of yet.

ctechdev · 2024-02-07T17:58:23Z

9.6.0

Any update? I'm using flutter_stripe: ^10.0.0 but on Android with dark theme the problem persists

casumatt · 2024-02-24T11:30:03Z

Also looking for an update ASAP

paulinovm · 2024-03-07T09:33:37Z

I am using version 10.1.0 and I have the same problem, both in debug and realase. Any help? I have configured the theme as shown in the example (copy and paste), in build.gradle I have the same versions as in the example but nothing.

Nico04 · 2024-03-27T13:08:23Z

Using v10.1.1, and I have the same issue with the CardFormField : it throws and leave a blank. CardField works fine.

remonh87 · 2024-04-14T15:36:25Z

@jonasbark do you have an update on this? I remember you took a look at it.

casumatt added the needs triage Needs triage label Aug 23, 2023

remonh87 closed this as completed Dec 20, 2023

remonh87 reopened this Jan 4, 2024

remonh87 added the Awaiting response Awaiting response from the issuer label Jan 8, 2024

remonh87 added bug Something isn't working Android Issue related to Android native bindings and removed Awaiting response Awaiting response from the issuer needs triage Needs triage labels Jan 8, 2024

remonh87 assigned jonasbark Jan 8, 2024

blk-raffy mentioned this issue Jan 11, 2024

Blank CardField Widget on Android #1594

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

CardField widget displaying as blank on Android #1383

CardField widget displaying as blank on Android #1383

casumatt commented Aug 23, 2023

remonh87 commented Aug 24, 2023

LScodeblack commented Aug 24, 2023

casumatt commented Aug 28, 2023

casumatt commented Aug 29, 2023

guidotheelen commented Oct 16, 2023 •

edited

Loading

yussifm commented Dec 8, 2023

yussifm commented Dec 8, 2023

remonh87 commented Dec 20, 2023

kekko7072 commented Jan 4, 2024 •

edited

Loading

remonh87 commented Jan 4, 2024

kekko7072 commented Jan 4, 2024 •

edited

Loading

kekko7072 commented Jan 4, 2024 •

edited

Loading

remonh87 commented Jan 8, 2024

kekko7072 commented Jan 8, 2024 •

edited

Loading

remonh87 commented Jan 8, 2024

jonasbark commented Jan 10, 2024

ctechdev commented Feb 7, 2024

casumatt commented Feb 24, 2024

paulinovm commented Mar 7, 2024

Nico04 commented Mar 27, 2024

remonh87 commented Apr 14, 2024

CardField widget displaying as blank on Android #1383

CardField widget displaying as blank on Android #1383

Comments

casumatt commented Aug 23, 2023

remonh87 commented Aug 24, 2023

LScodeblack commented Aug 24, 2023

casumatt commented Aug 28, 2023

casumatt commented Aug 29, 2023

guidotheelen commented Oct 16, 2023 • edited Loading

yussifm commented Dec 8, 2023

yussifm commented Dec 8, 2023

remonh87 commented Dec 20, 2023

kekko7072 commented Jan 4, 2024 • edited Loading

remonh87 commented Jan 4, 2024

kekko7072 commented Jan 4, 2024 • edited Loading

kekko7072 commented Jan 4, 2024 • edited Loading

remonh87 commented Jan 8, 2024

kekko7072 commented Jan 8, 2024 • edited Loading

remonh87 commented Jan 8, 2024

jonasbark commented Jan 10, 2024

ctechdev commented Feb 7, 2024

casumatt commented Feb 24, 2024

paulinovm commented Mar 7, 2024

Nico04 commented Mar 27, 2024

remonh87 commented Apr 14, 2024

guidotheelen commented Oct 16, 2023 •

edited

Loading

kekko7072 commented Jan 4, 2024 •

edited

Loading

kekko7072 commented Jan 4, 2024 •

edited

Loading

kekko7072 commented Jan 4, 2024 •

edited

Loading

kekko7072 commented Jan 8, 2024 •

edited

Loading