RawGooglePayButton: set up custom height (native PayButton doesn't fill platform view)
Chưa có ai nhận issue này.
Đánh giá
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức phù hợp với người mới
- 52/100
Hướng nghiên cứu
Start by reading PayButtonView.kt, where the Android platform view creates and initializes the native PayButton; compare its layout behavior with the Flutter widget sizing described in the report. Check the related platform view tests or add a reproduction for a 64dp parent height. Done means the native button fills the height supplied by Flutter without breaking its content or existing button behavior.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
Describe the bug
RawGooglePayButton cannot be made taller than 48dp. When it is wrapped in a SizedBox with a larger height, for example 64, the platform view takes the full 64dp. The native Google Pay button stays 48dp tall at the top of it, with 16dp of empty space below.
The same happens with GooglePayButton, which wraps RawGooglePayButton.
To Reproduce
- Add the following widget on an Android device or emulator:
SizedBox(
width: double.infinity,
height: 64,
child: RawGooglePayButton(
paymentConfiguration: PaymentConfiguration.fromJsonString('''
{
"provider": "google_pay",
"data": {
"environment": "TEST",
"apiVersion": 2,
"apiVersionMinor": 0,
"allowedPaymentMethods": []
}
}
'''),
onPressed: () {},
),
);
- The button is drawn 48dp tall, not 64dp.
Expected behavior
The button fills the height given by its parent.
Screenshots
Additional context
This problem was already described here but it was closed by author for unknown reasons: https://github.com/google-pay/flutter-plugin/issues/256
Workaround
This is an AI-generated workaround that makes the button fills the height. I can open a PR if the approach is acceptable:
- In
PayButtonView.kt, afterpayButton.initialize(...), setMATCH_PARENTwidth and height on the inflated containerViewGroups.
Code:
/**
* Copyright 2025 Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package io.flutter.plugins.pay_android.view
import android.content.Context
import android.view.ViewGroup
import android.view.ViewGroup.LayoutParams.MATCH_PARENT
import com.google.android.gms.wallet.button.ButtonOptions
import com.google.android.gms.wallet.button.ButtonConstants.ButtonTheme
import com.google.android.gms.wallet.button.ButtonConstants.ButtonType
import com.google.android.gms.wallet.button.PayButton
import io.flutter.plugin.common.BinaryMessenger
import io.flutter.plugin.common.MethodChannel
import io.flutter.plugin.platform.PlatformView
import org.json.JSONArray
import org.json.JSONObject
private const val VIEW_TYPE = "plugins.flutter.io/pay/google_pay_button"
private const val METHOD_ON_PRESSED = "onPressed"
internal class PayButtonView(private val context: Context, binaryMessenger: BinaryMessenger, viewId: Int, creationParams: Map<String, Any>) : PlatformView {
private val payButton: PayButton
private val methodChannel: MethodChannel
init {
// Instantiate method channel
methodChannel = MethodChannel(binaryMessenger, "$VIEW_TYPE/$viewId");
// Build pay button
payButton = PayButton(context)
buildPayButton(creationParams)
}
private fun buildPayButton(buttonParams: Map<String, Any>) {
val buttonTheme = ButtonThemeFactory.fromString(buttonParams["theme"] as String)
val buttonType = ButtonTypeFactory.fromString(buttonParams["type"] as String)
val cornerRadiusDp = buttonParams["cornerRadius"] as Int
val cornerRadius = (cornerRadiusDp * context.resources.displayMetrics.density).toInt()
// Parse payment configuration
val payConfiguration = JSONObject(buttonParams["paymentConfiguration"] as String)
val allowedPaymentMethods: JSONArray = payConfiguration["allowedPaymentMethods"] as JSONArray
payButton.initialize(ButtonOptions.newBuilder()
.setButtonTheme(buttonTheme)
.setButtonType(buttonType)
.setCornerRadius(cornerRadius)
.setAllowedPaymentMethods(allowedPaymentMethods.toString())
.build())
stretchToFill(payButton)
payButton.setOnClickListener {
methodChannel.invokeMethod(METHOD_ON_PRESSED, null)
}
}
// The inflated button container is wrap_content with a 48dp minimum height, so
// it must be stretched to follow the height given by the Flutter side. Leaf
// views (logo, text) keep their own size.
private fun stretchToFill(group: ViewGroup) {
group.layoutParams?.let {
it.width = MATCH_PARENT
it.height = MATCH_PARENT
group.layoutParams = it
}
for (i in 0 until group.childCount) {
(group.getChildAt(i) as? ViewGroup)?.let(::stretchToFill)
}
}
override fun getView() = payButton
override fun dispose() = Unit
}
class ButtonThemeFactory {
companion object {
fun fromString(buttonThemeString: String) = when(buttonThemeString) {
"dark" -> ButtonTheme.DARK
"light" -> ButtonTheme.LIGHT
else -> ButtonTheme.DARK
}
}
}
class ButtonTypeFactory {
companion object {
fun fromString(buttonTypeString: String) = when(buttonTypeString) {
"pay" -> ButtonType.PAY
"buy" -> ButtonType.BUY
"book" -> ButtonType.BOOK
"donate" -> ButtonType.DONATE
"checkout" -> ButtonType.CHECKOUT
"order" -> ButtonType.ORDER
"plain" -> ButtonType.PLAIN
"subscribe" -> ButtonType.SUBSCRIBE
"pix" -> ButtonType.PIX
else -> ButtonType.BUY
}
}
}
- Ngôn ngữ chính
- Dart
- Star
- 180
- Fork
- 144
- Chỉ số merge pull request
- Không có pull request nào được merge trong 30 ngày
Chuẩn bị môi trường
- Không có Dockerfile hay tệp Docker Compose
- Có mẫu pull request
- Đọc hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của google-pay/flutter-plugin
-
Unable to load asset: "packages/pay_platform_interface/pubspec.yaml".Có thể làm lại được Pull request cho issue này đã bị đóng mà không được merge. Đang mở
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 42/100
google-pay/flutter-plugin#331 ·
-
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 52/100
google-pay/flutter-plugin#323 · 3 bình luận · 1 reaction ·
-
Apple Pay Bottom Sheet – Incorrect Failure Design Handling After Backend Call Using Apple Pay TokenĐang mở
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 25/100
google-pay/flutter-plugin#322 · 1 bình luận ·
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 52/100
google-pay/flutter-plugin#321 · 2 bình luận · 9 reaction ·
-
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 40/100
google-pay/flutter-plugin#312 · 1 bình luận ·
Tất cả issue của google-pay/flutter-plugin
Issue tương tự
-
'图片收藏'功能无法滑动Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 68/100
venera-app/venera-prime#50 ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 76/100
Maintainer thường phản hồi trong vòng 1 ngày
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 78/100
Tencent/tdesign-flutter#1229 · 1 bình luận ·
Maintainer thường phản hồi trong vòng 1 ngày
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
VeryGoodOpenSource/very_good_analysis#254 ·
Maintainer thường phản hồi trong vòng 1 ngày
-
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 82/100
flutter/agent-plugins#253 ·