diff --git a/assets/translations/en.json b/assets/translations/en.json
index 4eeb925c12820054fe9b7341ef512855f348e156..ada15faf92f35db20a0ffcc906b098374d36e949 100644
--- a/assets/translations/en.json
+++ b/assets/translations/en.json
@@ -224,5 +224,6 @@
"qr_scanner_flash_off": "FLASH OFF",
"qr_scanner_title": "Scan QR Code",
"display_amounts_du": "Display amounts in DU",
- "wallet_already_imported": "Wallet already imported"
+ "wallet_already_imported": "Wallet already imported",
+ "card_theme_select": "Select a theme for your card"
}
diff --git a/assets/translations/es.json b/assets/translations/es.json
index 8b6382ab9979e405a436b93a8c9bfca5c3b1bbd2..ae4c7e0779ba3a8a5548498d45db37c3df2455cf 100644
--- a/assets/translations/es.json
+++ b/assets/translations/es.json
@@ -227,5 +227,6 @@
"qr_scanner_flash_off": "FLASH OFF",
"qr_scanner_title": "Escanea un QR Code",
"display_amounts_du": "Mostrar importes en DU",
- "wallet_already_imported": "Monedero ya importado"
+ "wallet_already_imported": "Monedero ya importado",
+ "card_theme_select": "Selecciona un tema para tu tarjeta"
}
diff --git a/lib/data/models/credit_card_theme_selector.dart b/lib/data/models/credit_card_theme_selector.dart
new file mode 100644
index 0000000000000000000000000000000000000000..2f4400548bde264b57252ccea952cdc5f8b611a7
--- /dev/null
+++ b/lib/data/models/credit_card_theme_selector.dart
@@ -0,0 +1,31 @@
+import 'package:flutter/material.dart';
+
+import '../../ui/widgets/first_screen/credit_card_theme_item.dart';
+import 'cesium_card.dart';
+import 'credit_card_themes.dart';
+
+class CardThemeSelector extends StatelessWidget {
+ const CardThemeSelector({super.key, required this.card});
+
+ final CesiumCard card;
+
+ @override
+ Widget build(BuildContext context) {
+ return GridView.builder(
+ gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+ crossAxisCount: 2,
+ childAspectRatio: 1.58,
+ ),
+ itemCount: CreditCardThemes.themes.length,
+ itemBuilder: (BuildContext context, int index) {
+ final CreditCardTheme themeData = CreditCardThemes.themes[index];
+ return GestureDetector(
+ onTap: () {},
+ child: Center(
+ child: CreditCardThemeItem(themeIndex: index),
+ ),
+ );
+ },
+ );
+ }
+}
diff --git a/lib/data/models/credit_card_themes.dart b/lib/data/models/credit_card_themes.dart
index 9f0c0838538840649f214fd1e439c62a809fca40..ea105e0566403bf28f70a86f1491e6c3ccbd9338 100644
--- a/lib/data/models/credit_card_themes.dart
+++ b/lib/data/models/credit_card_themes.dart
@@ -1,5 +1,4 @@
-import 'dart:ui';
-
+import 'package:flutter/material.dart';
import 'package:json_annotation/json_annotation.dart';
import 'is_json_serializable.dart';
@@ -7,46 +6,53 @@ import 'is_json_serializable.dart';
part 'credit_card_themes.g.dart';
class CreditCardThemes {
- static const CreditCardTheme theme1 = CreditCardTheme(
- Color(0xFF1A237E),
- Color(0xFFFFBA00),
- );
+ static const CreditCardTheme theme1 =
+ CreditCardTheme(Color(0xFF05112B), Color(0xFF085476));
static const CreditCardTheme theme2 = CreditCardTheme(
- Color(0xFFEC1C24),
- Color(0xFFFF5F00),
+ Colors.blueGrey,
+ Colors.pink,
);
static const CreditCardTheme theme3 = CreditCardTheme(
- Color(0xFF0077B5),
Color(0xFF00A9E0),
+ Color(0xFF0077B5),
);
static const CreditCardTheme theme4 = CreditCardTheme(
- Color(0xFF8C1D40),
Color(0xFFFDB813),
+ Color(0xFF8C1D40),
);
static const CreditCardTheme theme5 = CreditCardTheme(
- Color(0xFF117AC9),
- Color(0xFFEE7203),
- );
- static const CreditCardTheme theme6 = CreditCardTheme(
- Color(0xFF00529B),
- Color(0xFF00AEEF),
+ Colors.blueGrey,
+ Colors.deepPurple,
);
+ static const CreditCardTheme theme6 =
+ CreditCardTheme(Colors.lightGreen, Colors.green);
static const CreditCardTheme theme7 = CreditCardTheme(
- Color(0xFFE41422),
- Color(0xFF1C5D8D),
+ Colors.black54,
+ Colors.black,
);
static const CreditCardTheme theme8 = CreditCardTheme(
+ Colors.blueGrey,
Color(0xFF004678),
- Color(0xFFB5C8E5),
);
static const CreditCardTheme theme9 = CreditCardTheme(
Color(0xFFCE002D),
Color(0xFF673F1E),
);
- static const CreditCardTheme theme10 = CreditCardTheme(
- Color(0xFFDD5600),
- Color(0xFFC6A700),
- );
+ static const CreditCardTheme theme10 =
+ CreditCardTheme(Color(0xFF598040), Color(0xFF225500));
+
+ static const List<CreditCardTheme> themes = <CreditCardTheme>[
+ CreditCardThemes.theme1,
+ CreditCardThemes.theme2,
+ CreditCardThemes.theme3,
+ CreditCardThemes.theme4,
+ CreditCardThemes.theme5,
+ CreditCardThemes.theme6,
+ CreditCardThemes.theme7,
+ CreditCardThemes.theme8,
+ CreditCardThemes.theme9,
+ CreditCardThemes.theme10,
+ ];
}
@JsonSerializable()
diff --git a/lib/main.dart b/lib/main.dart
index 4fa5ac74521f519a04c7b8fd1e61a703c51e15e9..c9f37cb8b15b0eba7184178efff9eb55692b3a7b 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -10,7 +10,6 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_displaymode/flutter_displaymode.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
-import 'package:ginkgo/ui/pay_helper.dart';
import 'package:hive_flutter/hive_flutter.dart';
import 'package:hydrated_bloc/hydrated_bloc.dart';
import 'package:introduction_screen/introduction_screen.dart';
@@ -44,6 +43,7 @@ import 'shared_prefs.dart';
import 'ui/contacts_cache.dart';
import 'ui/logger.dart';
import 'ui/notification_controller.dart';
+import 'ui/pay_helper.dart';
import 'ui/screens/skeleton_screen.dart';
import 'ui/ui_helpers.dart';
import 'ui/widgets/connectivity_widget_wrapper_wrapper.dart';
diff --git a/lib/ui/ui_helpers.dart b/lib/ui/ui_helpers.dart
index 3ea44e0b45b610e498f4304721b851b2348a23bf..09653e89bb47b977af803f5c41321ed608b9ed3e 100644
--- a/lib/ui/ui_helpers.dart
+++ b/lib/ui/ui_helpers.dart
@@ -547,3 +547,5 @@ bool isDark(BuildContext context) =>
bool get isIOS => !kIsWeb && Platform.isIOS;
const String userNameSuffix = ' â¥';
+
+const double cardAspectRatio = 1.58;
diff --git a/lib/ui/widgets/first_screen/credit_card.dart b/lib/ui/widgets/first_screen/credit_card.dart
index 6326d0ca1c37a6a4b21465345fbbaae94d641c33..bf38c6955818d804910eb36f1b79ccb4a4b61dcc 100644
--- a/lib/ui/widgets/first_screen/credit_card.dart
+++ b/lib/ui/widgets/first_screen/credit_card.dart
@@ -28,7 +28,7 @@ class CreditCard extends StatelessWidget {
borderRadius: BorderRadius.circular(cardRadius),
),
child: AspectRatio(
- aspectRatio: 1.58, // Credit cart aspect ratio
+ aspectRatio: cardAspectRatio, // Credit cart aspect ratio
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(cardRadius),
diff --git a/lib/ui/widgets/first_screen/credit_card_mini.dart b/lib/ui/widgets/first_screen/credit_card_mini.dart
index 5668103e9279e5fd5eb2853ad8203d1ebb95965c..ac18f03a56a1a1fe4ae238dd21c79205f390178a 100644
--- a/lib/ui/widgets/first_screen/credit_card_mini.dart
+++ b/lib/ui/widgets/first_screen/credit_card_mini.dart
@@ -1,21 +1,47 @@
+import 'dart:math';
+
+import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import '../../../data/models/cesium_card.dart';
+import '../../../data/models/credit_card_theme_selector.dart';
import '../../../data/models/credit_card_themes.dart';
import '../../ui_helpers.dart';
import 'card_name_editable.dart';
import 'card_text_style.dart';
-class CreditCardMini extends StatelessWidget {
+class CreditCardMini extends StatefulWidget {
const CreditCardMini({super.key, required this.card});
final CesiumCard card;
+ @override
+ State<CreditCardMini> createState() => _CreditCardMiniState();
+}
+
+class _CreditCardMiniState extends State<CreditCardMini> {
+ bool _showSettingsIcon = false;
+
+ void _showThemeSelector(BuildContext context) {
+ showDialog(
+ context: context,
+ builder: (BuildContext context) {
+ return AlertDialog(
+ title: Text(tr('card_theme_select')),
+ content: SizedBox(
+ width: double.maxFinite,
+ child: CardThemeSelector(card: widget.card)),
+ );
+ },
+ );
+ }
+
@override
Widget build(BuildContext context) {
const double cardRadius = 10.0;
final bool bigDevice = bigScreen(context);
final double cardInternalElPadding = bigDevice ? 5 : 6.0;
+ final int themeIndex = Random().nextInt(10);
return Padding(
padding: const EdgeInsets.all(10),
child: Card(
@@ -24,7 +50,7 @@ class CreditCardMini extends StatelessWidget {
borderRadius: BorderRadius.circular(cardRadius),
),
child: AspectRatio(
- aspectRatio: 1.58, // Credit cart aspect ratio
+ aspectRatio: cardAspectRatio, // Credit cart aspect ratio
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(cardRadius),
@@ -39,8 +65,8 @@ class CreditCardMini extends StatelessWidget {
begin: Alignment.bottomLeft,
end: Alignment.topRight,
colors: <Color>[
- CreditCardThemes.theme3.primaryColor,
- CreditCardThemes.theme3.secondaryColor,
+ CreditCardThemes.themes[themeIndex].primaryColor,
+ CreditCardThemes.themes[themeIndex].secondaryColor,
// card.theme.primaryColor,
// card.theme.secondaryColor,
],
@@ -49,10 +75,24 @@ class CreditCardMini extends StatelessWidget {
child: Padding(
padding: const EdgeInsets.all(10),
child: Stack(children: <Widget>[
+ Positioned(
+ top: -10,
+ right: -10,
+ child: Visibility(
+ visible: true,
+ child: FloatingActionButton(
+ backgroundColor: Colors.transparent,
+ elevation: 0,
+ onPressed: () => _showThemeSelector(context),
+ child: const Icon(Icons.settings,
+ color: Colors.white),
+ ),
+ ),
+ ),
Padding(
padding: const EdgeInsets.fromLTRB(120, 10, 0, 0),
child: Opacity(
- opacity: 0.1,
+ opacity: 0.2,
child: Image.asset('assets/img/gbrevedot_alt.png',
width: 100, height: 100),
)),
@@ -60,7 +100,7 @@ class CreditCardMini extends StatelessWidget {
crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
- if (card.name.isNotEmpty)
+ if (widget.card.name.isNotEmpty)
Padding(
padding: EdgeInsets.symmetric(
horizontal: cardInternalElPadding,
@@ -68,9 +108,8 @@ class CreditCardMini extends StatelessWidget {
child: Row(children: <Widget>[
Expanded(
child: CardNameText(
- currentText: card.name,
- onTap: () {},
- )),
+ currentText: widget.card.name,
+ onTap: () {})),
])),
Padding(
padding: EdgeInsets.symmetric(
@@ -80,11 +119,11 @@ class CreditCardMini extends StatelessWidget {
GestureDetector(
onTap: () => showQrDialog(
context: context,
- publicKey: card.pubKey),
+ publicKey: widget.card.pubKey),
child: FittedBox(
fit: BoxFit.scaleDown,
child: Text(
- '${card.pubKey.substring(0, 4)} ${card.pubKey.substring(4, 8)}',
+ '$themeIndex ${widget.card.pubKey.substring(0, 4)} ${widget.card.pubKey.substring(4, 8)}',
style: cardTextStyle(context,
fontSize: 16),
))),
diff --git a/lib/ui/widgets/first_screen/credit_card_theme_item.dart b/lib/ui/widgets/first_screen/credit_card_theme_item.dart
new file mode 100644
index 0000000000000000000000000000000000000000..17643260d86dfc93d4308e3f55c7e233725d227a
--- /dev/null
+++ b/lib/ui/widgets/first_screen/credit_card_theme_item.dart
@@ -0,0 +1,61 @@
+import 'package:flutter/material.dart';
+
+import '../../../data/models/credit_card_themes.dart';
+import '../../ui_helpers.dart';
+import 'card_text_style.dart';
+
+class CreditCardThemeItem extends StatelessWidget {
+ const CreditCardThemeItem({super.key, required this.themeIndex});
+
+ final int themeIndex;
+
+ @override
+ Widget build(BuildContext context) {
+ const double cardRadius = 10.0;
+ return Padding(
+ padding: const EdgeInsets.all(1),
+ child: Card(
+ elevation: 4.0,
+ shape: RoundedRectangleBorder(
+ borderRadius: BorderRadius.circular(cardRadius),
+ ),
+ child: AspectRatio(
+ aspectRatio: cardAspectRatio, // Credit cart aspect ratio
+ child: Container(
+ decoration: BoxDecoration(
+ borderRadius: BorderRadius.circular(cardRadius),
+ boxShadow: <BoxShadow>[
+ BoxShadow(
+ color: Colors.grey[400]!,
+ blurRadius: 3.0,
+ spreadRadius: 1.0,
+ )
+ ],
+ gradient: LinearGradient(
+ begin: Alignment.bottomLeft,
+ end: Alignment.topRight,
+ colors: <Color>[
+ CreditCardThemes.themes[themeIndex].primaryColor,
+ CreditCardThemes.themes[themeIndex].secondaryColor,
+ // card.theme.primaryColor,
+ // card.theme.secondaryColor,
+ ],
+ ),
+ ),
+ child: Padding(
+ padding: const EdgeInsets.all(10),
+ child: Stack(children: <Widget>[
+ if (inDevelopment)
+ Text('${themeIndex + 1}',
+ style: cardTextStyle(context, fontSize: 14)),
+ Padding(
+ padding: const EdgeInsets.fromLTRB(40, 0, 0, 0),
+ child: Opacity(
+ opacity: 0.2,
+ child: Image.asset('assets/img/gbrevedot_alt.png',
+ width: 100, height: 100),
+ )),
+ ]),
+ )))));
+ }
+}
diff --git a/lib/ui/widgets/first_screen/g1_textfield.dart b/lib/ui/widgets/first_screen/g1_textfield.dart
index f45f0d4316430355c872bc319e6883c513849c2a..a42f8fa0d6a64aadb2227a8307e9b88e93f7d156 100644
--- a/lib/ui/widgets/first_screen/g1_textfield.dart
+++ b/lib/ui/widgets/first_screen/g1_textfield.dart
@@ -113,7 +113,7 @@ class _G1PayAmountFieldState extends State<G1PayAmountField> {
child: ToggleSwitch(
minWidth: 40.0,
radiusStyle: true,
- initialLabelIndex: 0,
+ // initialLabelIndex: 0,
cornerRadius: 20.0,
activeFgColor: Colors.black,
inactiveBgColor: Colors.grey[400],