google-pay / google-pay/flutter-plugin

Issue with Google Pay Button Rendering in Light Theme and Theme.AppCompat Error

Open
#271 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Dart
Stars
176
Forks
147
PR merge metrics
No merged PRs in 30d

Description

Description:
There seems to be an issue when using the Google Pay Button with the pay package in Flutter. The button does not render correctly when using the light theme, and there are errors related to the Theme.AppCompat.

Steps to Reproduce:

Add the pay package and necessary dependencies to the Flutter project.
Run the app and observe the rendering issue and log errors.
Expected Behavior:
The Google Pay Button should render correctly with the light theme applied.

Observed Behavior:
The button shows graphical glitches or does not render correctly. Additionally, there are errors in the logs related to using Theme.AppCompat.

Additional Information:

The error message indicates an issue with the attribute at index 0, related to the Theme.AppCompat.
Please investigate this issue to determine the root cause and provide a fix or workaround. Thank you.

Additional Information:

pay package version: pay: ^2.0.0

flutter --version
Flutter 3.22.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision b0850beeb2 (3 weeks ago) • 2024-07-16 21:43:41 -0700
Engine • revision 235db911ba
Tools • Dart 3.4.4 • DevTools 2.34.3

Android Studio Koala | 2024.1.1 Patch 1
Build #AI-241.18034.62.2411.12071903, built on July 10, 2024
Runtime version: 17.0.11+0--11852314 amd64
VM: OpenJDK 64-Bit Server VM by JetBrains s.r.o.
Windows 11.0
GC: G1 Young Generation, G1 Old Generation
Memory: 4058M
Cores: 24
Registry:
debugger.new.tool.window.layout=true
ide.experimental.ui=true

Relevant code:

Center(
child: GooglePayButton(
paymentConfiguration: paymentConfig,
key: Key(selectedIndex.toString()),

paymentItems: [
  PaymentItem(
    label: 'Total',
    amount: (() {
      final price = packages![selectedIndex].price.toString();
      return price;
    })(),
    status: PaymentItemStatus.final_price,
  )
],

theme: GooglePayButtonTheme.light,
type: GooglePayButtonType.pay,
margin: const EdgeInsets.only(top: 15.0),
onPressed: () {
  setState(() {});
  return;
},
onPaymentResult: (result) async {
  try {
    String res = result.toString();
    log("Payment result: $res");
    String tokenJson = result['methodData']['tokenData']['token'];
    Map<String, dynamic> tokenData = jsonDecode(tokenJson);
    String tokenId = tokenData['id'];

    int amount = convertToIntMultiplyBy100(packages![selectedIndex].price);
    String tokenDesc = result['methodData']['description'];

    await processStripePayment(
      tokenId,
      amount,
      packages![selectedIndex].points,
      tokenDesc,
    );
  } catch (e, s) {
    userFeedback.showFeedbackMessage("Payment Error", e.toString());
    handleError(e, s, 'Payment Error');
  }
},
onError: (error) {
  log("Payment error: $error");
},
loadingIndicator: const Center(
  child: CircularProgressIndicator(),
),

),
),

Manifest Configuration:

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

<application
    android:enableOnBackInvokedCallback="true"
    android:usesCleartextTraffic="true"
    android:label="xpt"
    android:name="${applicationName}"
    android:icon="@mipmap/ic_launcher">

    <activity
        android:name=".MainActivity"
        android:exported="true"
        android:launchMode="singleTop"
        android:theme="@style/Theme.AppCompat.Light"
        android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
        android:hardwareAccelerated="true"
        android:windowSoftInputMode="adjustResize">

        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity>

    <meta-data
        android:name="flutterEmbedding"
        android:value="2" />

    <meta-data
        android:name="com.google.android.gms.wallet.api.enabled"
        android:value="true"/>
</application>

<queries>
    <intent>
        <action android:name="android.intent.action.VIEW" />
        <data android:scheme="sms" />
    </intent>
    <intent>
        <action android:name="android.intent.action.VIEW" />
        <data android:scheme="tel" />
    </intent>
    <intent>
        <action android:name="android.intent.action.SENDTO" />
        <data android:scheme="mailto" />
    </intent>
</queries>

Dependencies:

dependencies {
implementation 'com.android.support:multidex:1.0.3'
implementation "androidx.multidex:multidex:2.0.1"
implementation 'com.google.android.material:material:1.9.0'
implementation 'androidx.compose.material:material:1.6.8'
implementation 'com.google.android.gms:play-services-wallet:19.4.0'
implementation 'com.google.android.gms:play-services-base:18.5.0'
implementation 'com.stripe:stripe-android:20.37.4'
implementation(platform("com.google.firebase:firebase-bom:33.1.2"))
implementation("com.google.firebase:firebase-crashlytics-ndk")
implementation("com.google.firebase:firebase-analytics")
}

LOG Output

E/ThemeUtils(32156): View class android.support.v7.widget.AppCompatTextView is an AppCompat widget that can only be used with a Theme.AppCompat theme (or descendant).
E/ThemeUtils(32156): View class com.google.android.material.imageview.ShapeableImageView is an AppCompat widget that can only be used with a Theme.AppCompat theme (or descendant).
W/ResourcesCompat(32156): Failed to inflate ColorStateList, leaving it to the framework
W/ResourcesCompat(32156): java.lang.UnsupportedOperationException: Failed to resolve attribute at index 0: TypedValue{t=0x2/d=0x7b040084 a=-1}, theme={InheritanceMap=[id=0x7b1100abcom.google.android.gms:style/PayButtonLightTheme], Themes=[com.google.android.gms:style/PayButtonLightTheme, forced, android:style/Theme.DeviceDefault.Light.DarkActionBar, forced]}
W/ResourcesCompat(32156): at android.content.res.TypedArray.getColor(TypedArray.java:529)
W/ResourcesCompat(32156): at m.jf.b(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):18)
W/ResourcesCompat(32156): at m.jf.a(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):24)
W/ResourcesCompat(32156): at m.jb.a(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):126)
W/ResourcesCompat(32156): at com.google.android.material.imageview.ShapeableImageView.(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):31)
W/ResourcesCompat(32156): at com.google.android.material.imageview.ShapeableImageView.(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):2)
W/ResourcesCompat(32156): at java.lang.reflect.Constructor.newInstance0(Native Method)
W/ResourcesCompat(32156): at java.lang.reflect.Constructor.newInstance(Constructor.java:343)
W/ResourcesCompat(32156): at android.view.LayoutInflater.createView(LayoutInflater.java:866)
W/ResourcesCompat(32156): at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:1018)
W/ResourcesCompat(32156): at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:973)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflate(LayoutInflater.java:1135)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:1096)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflate(LayoutInflater.java:1138)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:1096)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflate(LayoutInflater.java:1138)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:1096)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflate(LayoutInflater.java:1138)
W/ResourcesCompat(32156): at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:1096)
W/ResourcesCompat(32156): at android.view.LayoutInflater.inflate(LayoutInflater.java:694)
W/ResourcesCompat(32156): at android.view.LayoutInflater.inflate(LayoutInflater.java:538)
W/ResourcesCompat(32156): at m.bdv.d(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):337)
W/ResourcesCompat(32156): at m.bdv.b(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):30)
W/ResourcesCompat(32156): at com.google.android.gms.wallet.dynamite.PayButtonCreatorChimeraImpl.newPayButton(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):51)
W/ResourcesCompat(32156): at m.bdl.z(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):43)
W/ResourcesCompat(32156): at m.rz.onTransact(:com.google.android.gms.dynamite_dynamitemodulesc@242835041@24.28.35 (190800-0):21)
W/ResourcesCompat(32156): at android.os.Binder.transact(Binder.java:1183)
W/ResourcesCompat(32156): at com.google.android.gms.internal.wallet.zza.zzb(com.google.android.gms:play-services-wallet@@19.3.0:2)
W/ResourcesCompat(32156): at com.google.android.gms.wallet.button.zze.zzd(com.google.android.gms:play-services-wallet@@19.3.0:4)
W/ResourcesCompat(32156): at com.google.android.gms.wallet.button.zzf.zza(com.google.android.gms:play-services-wallet@@19.3.0:6)
W/ResourcesCompat(32156): at com.google.android.gms.wallet.button.PayButton.initialize(com.google.android.gms:play-services-wallet@@19.3.0:17)
W/ResourcesCompat(32156): at io.flutter.plugins.pay_android.view.PayButtonView.buildPayButton(PayButtonView.kt:61)
W/ResourcesCompat(32156): at io.flutter.plugins.pay_android.view.PayButtonView.(PayButtonView.kt:48)
W/ResourcesCompat(32156): at io.flutter.plugins.pay_android.view.PayButtonViewFactory.create(PayButtonViewFactory.kt:27)
W/ResourcesCompat(32156): at io.flutter.plugin.platform.PlatformViewsController.createPlatformView(PlatformViewsController.java:523)
W/ResourcesCompat(32156): at io.flutter.plugin.platform.PlatformViewsController$1.createForTextureLayer(PlatformViewsController.java:197)
W/ResourcesCompat(32156): at io.flutter.embedding.engine.systemchannels.PlatformViewsChannel$1.create(PlatformViewsChannel.java:128)
W/ResourcesCompat(32156): at io.flutter.embedding.engine.systemchannels.PlatformViewsChannel$1.onMethodCall(PlatformViewsChannel.java:55)
W/ResourcesCompat(32156): at io.flutter.plugin.common.MethodChannel$IncomingMethodCallHandler.onMessage(MethodChannel.java:267)
W/ResourcesCompat(32156): at io.flutter.embedding.engine.dart.DartMessenger.invokeHandler(DartMessenger.java:292)
W/ResourcesCompat(32156): at io.flutter.embedding.engine.dart.DartMessenger.lambda$dispatchMessageToQueue$0$io-flutter-embedding-engine-dart-DartMessenger(DartMessenger.java:319)
W/ResourcesCompat(32156): at io.flutter.embedding.engine.dart.DartMessenger$$ExternalSyntheticLambda0.run(Unknown Source:12)
W/ResourcesCompat(32156): at android.os.Handler.handleCallback(Handler.java:958)
W/ResourcesCompat(32156): at android.os.Handler.dispatchMessage(Handler.java:99)
W/ResourcesCompat(32156): at android.os.Looper.loopOnce(Looper.java:205)
W/ResourcesCompat(32156): at android.os.Looper.loop(Looper.java:294)
W/ResourcesCompat(32156): at android.app.ActivityThread.main(ActivityThread.java:8177)
W/ResourcesCompat(32156): at java.lang.reflect.Method.invoke(Native Method)
W/ResourcesCompat(32156): at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:552)
W/ResourcesCompat(32156): at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:971)
E/ThemeUtils(32156): View class android.support.v7.widget.AppCompatTextView is an AppCompat widget that can only be used with a Theme.AppCompat theme (or descendant).
E/ThemeUtils(32156): View class android.support.v7.widget.AppCompatTextView is an AppCompat widget that can only be used with a Theme.AppCompat theme (or descendant).
I/PlatformViewsController(32156): Hosting view in view hierarchy for platform view: 0
I/PlatformViewsController(32156): PlatformView is using SurfaceProducer backend
W/ConnectionStatusConfig(32156): Dynamic lookup for intent failed for action: com.google.android.gms.wallet.service.BIND

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the Flutter GooglePayButton configuration and the Android PayButtonView.kt entry points cited in the stack trace, then compare the manifest theme and listed Google Play Services dependencies. Reproduce with pay 2.0.0 and the reported Flutter version; done means the light-themed button renders correctly without the Theme.AppCompat or attribute-resolution errors.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, dart, flutter, kotlin
Domain
mobile, payments
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.