flutter: как добавить кнопку Apple Pay в соответствии с рекомендациями Apple - PullRequest
Новая
       34

flutter: как добавить кнопку Apple Pay в соответствии с рекомендациями Apple

0 голосов
/ 09 июля 2020

Это довольно простая проблема, но мне было интересно, как добавить кнопку оплаты Apple в свое приложение Flutter. Нужно ли мне создавать кнопку с нуля, следуя рекомендациям Apple, или есть шаблон для использования? Я быстро вспомнил, что объект был легко доступен. Спасибо

1 Ответ

0 голосов
/ 10 июля 2020

Flutter не имеет ни кнопки, как Apple Pay, ни значка яблока.

Итак, вы можете сделать здесь две вещи ->

  1. Добавить пользовательский значок «Apple»

  2. Добавьте изображение «Apple» вместо значка (я думаю, вы это знаете)

[Сообщите мне, если вы не знаете, как добавить изображение]

, а затем вы можете создать такую ​​кнопку ...

  1. Посетите этот сайт , введите в поиске яблоко и выберите «Apple lo go», а не «Apple Pay lo go»,

    Измените имя файла с «MyFlutterApp» на «Custom» и загрузите его,

    Извлеките файлы, добавьте файл dart в свою папку lib

    и файл Custom.ttf в (папку с ресурсами или шрифтами или где угодно)

    и добавьте его в раздел шрифтов в pubspe c .yaml как показано в коде

Вот код: 

//pubspec.yaml ->
fonts:
  - family: Custom
    fonts:
      - assets/Custom.ttf //path of Custom.ttf in you project

//Dart file where you will add Apple pay button
import'custom_icons.dart' as CustomIcon;//custom_icons.dart is one of the downloaded file

//THIS IS THE NORMAL WAY TO CREATE A BUTTON
RaisedButton(
  color: Colors.black,
  onPressed: (){ 
    //ADD THE FUNCTIONS OF THIS BUTTON HERE
  },
  child: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      Icon(CustomIcon.Custom.apple, color: Colors.white,),
      SizedBox(width: 8.0,),
      Text('Apple Pay', style: TextStyle(color: Colors.white),)
    ],
  ),
),

//USE THIS FOR CUSTOMISING YOUR BUTTON
Container(
  height: 30.0,
  width: double.infinity,
  decoration: BoxDecoration(
    borderRadius: BorderRadius.all(Radius.circular(8.0)),
    color: Colors.black
  ),
  child: GestureDetector(
    onTap: (){
      //ADD THE FUNCTIONS OF THIS BUTTON HERE
    },
    child: Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Icon(CustomIcon.Custom.apple, color: Colors.white,),
        SizedBox(width: 8.0,),
        Text('Apple Pay', style: TextStyle(color: Colors.white),)
      ],
    ),
  ),
),
...