Alignment Issue UAE numbers - Fixed
This commit is contained in:
parent
630b004ed0
commit
d84a438c0f
@ -29,8 +29,8 @@ android {
|
||||
ndkVersion = flutter.ndkVersion
|
||||
|
||||
compileOptions {
|
||||
sourceCompatibility = JavaVersion.VERSION_1_8
|
||||
targetCompatibility = JavaVersion.VERSION_1_8
|
||||
sourceCompatibility = JavaVersion.VERSION_21
|
||||
targetCompatibility = JavaVersion.VERSION_21
|
||||
}
|
||||
|
||||
defaultConfig {
|
||||
|
||||
@ -18,8 +18,9 @@ pluginManagement {
|
||||
|
||||
plugins {
|
||||
id "dev.flutter.flutter-plugin-loader" version "1.0.0"
|
||||
id "com.android.application" version "7.3.0" apply false
|
||||
id "org.jetbrains.kotlin.android" version "1.8.22" apply false
|
||||
id "com.android.application" version "8.2.1" apply false
|
||||
id "org.jetbrains.kotlin.android" version "2.1.0" apply false
|
||||
|
||||
}
|
||||
|
||||
include ":app"
|
||||
|
||||
@ -19,3 +19,5 @@ class Competitiveness extends StatelessWidget {
|
||||
}
|
||||
Widget CompetitivenessState(BuildContext context) {return Center(child: Text("Competitiveness"));}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:uae_stat/presentation/components/constant/constant.dart';
|
||||
import 'package:uae_stat/presentation/routes/drawer_routes/custom_drawer_routes.dart';
|
||||
|
||||
class CountryProfile extends StatelessWidget {
|
||||
@ -15,258 +14,18 @@ class CountryProfile extends StatelessWidget {
|
||||
height: myheight / 5,
|
||||
width: mywidth / 3,
|
||||
child: Image(image: AssetImage('assets/logos/uae_stat.png')))),
|
||||
body: CountryProfileWidget(),
|
||||
body: CountryProfileWidget()
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class CountryProfileWidget extends StatelessWidget {
|
||||
const CountryProfileWidget({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
double mywidth = MediaQuery.of(context).size.width;
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: ListView(
|
||||
children: [
|
||||
CustomExpandableTile(
|
||||
title: 'ECONOMY',
|
||||
titleBackgroundColor: economyColor,
|
||||
children: [
|
||||
buildCategoryTitle('National Accounts',economyColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'GDP (Constant)', '1.62T', '2022 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
buildCard(context,'FDI', '1.45T', '2021 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('International Trade',economyColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Total Trade', '669.9B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
buildCard(context,'Total Import', '686B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
]),
|
||||
buildCardRow([
|
||||
buildCard(context,'Total Export', '669.9B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
buildCard(context,'Total ReExport', '686B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Prices',economyColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Total Export', '669.9B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/1.2),
|
||||
]),
|
||||
],
|
||||
),
|
||||
CustomExpandableTile(
|
||||
title: 'SOCIAL',
|
||||
titleBackgroundColor: socialColor,
|
||||
children: [
|
||||
buildCategoryTitle('Population',socialColor),
|
||||
buildCardRow([
|
||||
InkWell(onTap: (){},child: buildCard(context,'Population', '9.89M', '2024',socialColor,socialColor,mywidth/2.5)),
|
||||
buildCard(context,'Population Growth', '2.1%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Vital Statistics',socialColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Marriages', '96%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
buildCard(context,'Divorces', '1.2K', '2024',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Education',socialColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'General Education', '96%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
buildCard(context,'Higher Education', '1.2K', '2024',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Health',socialColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Hospital', '96%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
buildCard(context,'Clinic and Centres', '1.2K', '2024',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
],
|
||||
),
|
||||
CustomExpandableTile(
|
||||
title: 'ENVIRONMENT',
|
||||
titleBackgroundColor: environmentColor,
|
||||
children: [
|
||||
buildCategoryTitle('Agriculture',environmentColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Crops - Total Area', '27°C', 'Average 2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Livestock', '120mm', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Environment',environmentColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Climate - Max Temp', '15%', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Climate - Min Temp', '30%', '2023',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
buildCardRow([
|
||||
buildCard(context,'Desalinated Produced Water', '15%', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Area of Natural Reserves', '30%', '2023',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Energy',environmentColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Electricity Production', '15%', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Renewable Energy Production', '30%', '2023',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget buildCategoryTitle(String title,Color color) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 8.0),
|
||||
child: Text(
|
||||
title,
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget buildCardRow(List<Widget> cards) {
|
||||
return SingleChildScrollView(
|
||||
scrollDirection: Axis.horizontal,
|
||||
child: Row(
|
||||
children: cards.map((card) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8.0),
|
||||
child: card,
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget buildCard(BuildContext context,String title, String value, String subtitle,Color bordercolor,boldColor,double mywidth) {
|
||||
// double myheight = MediaQuery.of(context).size.height;
|
||||
// double mywidth = MediaQuery.of(context).size.width;
|
||||
return Card(
|
||||
elevation: 2,
|
||||
child: Container(
|
||||
width: mywidth,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white, // Background color
|
||||
border: Border.all(
|
||||
color: bordercolor, // Border color
|
||||
width: 2, // Border width
|
||||
),
|
||||
borderRadius: BorderRadius.circular(12), // Optional: Rounded corners
|
||||
),
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Text(
|
||||
title,
|
||||
textAlign: TextAlign.center,
|
||||
style: robotoRegular11,
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Text(
|
||||
subtitle,
|
||||
textAlign: TextAlign.center,
|
||||
style: subtitleStyle
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Text(
|
||||
value,
|
||||
style: TextStyle(
|
||||
fontSize: 26,
|
||||
color: boldColor,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
return Center(child: Text("COuntry Profile"),);
|
||||
}
|
||||
}
|
||||
|
||||
class CustomExpandableTile extends StatefulWidget {
|
||||
final String title;
|
||||
final Color titleBackgroundColor;
|
||||
final List<Widget> children;
|
||||
|
||||
const CustomExpandableTile({
|
||||
required this.title,
|
||||
required this.titleBackgroundColor,
|
||||
required this.children,
|
||||
});
|
||||
|
||||
@override
|
||||
_CustomExpandableTileState createState() => _CustomExpandableTileState();
|
||||
}
|
||||
|
||||
class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
bool isExpanded = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
double myheight = MediaQuery.of(context).size.height;
|
||||
return Card(
|
||||
elevation: 4,
|
||||
child: Column(
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
isExpanded = !isExpanded;
|
||||
});
|
||||
},
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: widget.titleBackgroundColor,
|
||||
borderRadius: BorderRadius.all(Radius.circular(12))
|
||||
),
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
widget.title,
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 18,
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
isExpanded
|
||||
? Icons.keyboard_arrow_up
|
||||
: Icons.keyboard_arrow_down,
|
||||
color: Colors.white,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
ClipRRect(
|
||||
child: AnimatedContainer(
|
||||
duration: Duration(milliseconds: 300),
|
||||
curve: Curves.easeInOut,
|
||||
width: double.infinity,
|
||||
height: isExpanded ? myheight : 0,
|
||||
child: isExpanded
|
||||
? SingleChildScrollView(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.all(Radius.circular(20))
|
||||
),
|
||||
|
||||
padding: const EdgeInsets.all(10),
|
||||
child: Column(
|
||||
children: widget.children,
|
||||
),
|
||||
),
|
||||
)
|
||||
: null,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,6 +1,8 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:uae_stat/presentation/routes/bottom_bar_routes/tab_routes/home_route.dart';
|
||||
import 'package:uae_stat/presentation/routes/drawer_routes/custom_drawer_routes.dart';
|
||||
import 'package:uae_stat/presentation/components/constant/constant.dart';
|
||||
|
||||
|
||||
class UaeNumbers extends StatelessWidget {
|
||||
const UaeNumbers({super.key});
|
||||
@ -10,387 +12,123 @@ class UaeNumbers extends StatelessWidget {
|
||||
double myheight = MediaQuery.of(context).size.height;
|
||||
double mywidth = MediaQuery.of(context).size.width;
|
||||
return BaseScaffold(
|
||||
title: Text("UAE Numbers"),
|
||||
body:
|
||||
//EconomicDashboard(),
|
||||
//EconomyExpandTile()
|
||||
CustomExpandableTile()
|
||||
);
|
||||
title: Text("UAE Numbers"),
|
||||
body:
|
||||
//EconomicDashboard(),
|
||||
//EconomyExpandTile()
|
||||
uaenumberWidget());
|
||||
}
|
||||
}
|
||||
|
||||
// class EconomicDashboard extends StatelessWidget {
|
||||
// const EconomicDashboard({Key? key}) : super(key: key);
|
||||
//
|
||||
// @override
|
||||
// Widget build(BuildContext context) {
|
||||
//
|
||||
// return SingleChildScrollView(
|
||||
// child: Padding(
|
||||
// padding: const EdgeInsets.all(16.0),
|
||||
// child: Column(
|
||||
// children: [
|
||||
// // Search Bar
|
||||
// Container(
|
||||
// padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
// decoration: BoxDecoration(
|
||||
// color: Colors.white,
|
||||
// borderRadius: BorderRadius.circular(20),
|
||||
// border: Border.all(
|
||||
// color: Color(0xFFAA8E83), // Border color
|
||||
// width: 3, // Border width
|
||||
// ),
|
||||
//
|
||||
// ),
|
||||
// child: const Row(
|
||||
// children: [
|
||||
// Icon(Icons.search, color: Colors.grey),
|
||||
// SizedBox(width: 8),
|
||||
// Expanded(
|
||||
// child: TextField(
|
||||
// decoration: InputDecoration(
|
||||
// hintText: 'Search',
|
||||
// border: InputBorder.none,
|
||||
// hintStyle: TextStyle(color: Colors.grey),
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
//
|
||||
// const SizedBox(height: 16),
|
||||
//
|
||||
// // Economy Section
|
||||
// _buildSection(
|
||||
// 'ECONOMY',
|
||||
// [
|
||||
// _buildRow(
|
||||
// [
|
||||
// _buildCard('GDP (Growth)', '1.62T', Colors.blue[100]!),
|
||||
// _buildCard('CPI', '1.45T', Colors.blue[100]!),
|
||||
// ],
|
||||
// ),
|
||||
// const SizedBox(height: 8),
|
||||
// const Text(
|
||||
// 'International Trade',
|
||||
// style: TextStyle(fontWeight: FontWeight.bold),
|
||||
// ),
|
||||
// _buildRow(
|
||||
// [
|
||||
// _buildCard('Total Trade\nLast Year (2023) YOY', '669.9B', Colors.white),
|
||||
// _buildCard('Total Import\nLast Year (2023) YOY', '686B', Colors.white),
|
||||
// ],
|
||||
// ),
|
||||
// _buildRow(
|
||||
// [
|
||||
// _buildCard('Total Export', '122.9B', Colors.white),
|
||||
// _buildCard('Total Import', '161B', Colors.white),
|
||||
// ],
|
||||
// ),
|
||||
// const SizedBox(height: 8),
|
||||
// const Text(
|
||||
// 'Prices',
|
||||
// style: TextStyle(fontWeight: FontWeight.bold),
|
||||
// ),
|
||||
// _buildCard('Inflation Rate', '215.4B', Colors.white, fullWidth: true,),
|
||||
// ],context
|
||||
// ),
|
||||
//
|
||||
// const SizedBox(height: 16),
|
||||
//
|
||||
// // Social Section
|
||||
// _buildSection('SOCIAL', [
|
||||
// _buildCard('Total Export', '122.9B', Colors.white),
|
||||
// _buildCard('Total Import', '161B', Colors.white),
|
||||
// ],context),
|
||||
//
|
||||
// const SizedBox(height: 16),
|
||||
//
|
||||
// // Environment Section
|
||||
// _buildSection('ENVIRONMENT', [
|
||||
// _buildCard('Total Export', '122.9B', Colors.white),
|
||||
// _buildCard('Total Import', '161B', Colors.white),
|
||||
// ],context)
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
//
|
||||
// Widget _buildSection(String title, List<Widget> children,BuildContext context) {
|
||||
// double myheight = MediaQuery.of(context).size.height;
|
||||
// double mywidth = MediaQuery.of(context).size.width;
|
||||
// return Container(
|
||||
// decoration: BoxDecoration(
|
||||
// color: title == 'ECONOMY' ? Color(0xFF7DAFBC) : Color(0xFFAA8E83),
|
||||
// borderRadius: BorderRadius.circular(16),
|
||||
// ),
|
||||
// child:
|
||||
// ExpansionTile(
|
||||
// iconColor: Colors.white,
|
||||
// collapsedIconColor: Colors.white,
|
||||
// title: Text(
|
||||
// title,
|
||||
// style: const TextStyle(fontWeight: FontWeight.bold,color: Colors.white),
|
||||
// ),
|
||||
// children: children,
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
//
|
||||
// Widget _buildRow(List<Widget> children) {
|
||||
// return Padding(
|
||||
// padding: const EdgeInsets.symmetric(vertical: 4),
|
||||
// child: Row(
|
||||
// children: children.map((child) => Expanded(child: child)).toList(),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
//
|
||||
// Widget _buildCard(String title, String value, Color color, {bool fullWidth = false}) {
|
||||
// return Container(
|
||||
// margin: EdgeInsets.symmetric(horizontal: fullWidth ? 0 : 4),
|
||||
// padding: const EdgeInsets.all(12),
|
||||
// decoration: BoxDecoration(
|
||||
// color: color,
|
||||
// borderRadius: BorderRadius.circular(8),
|
||||
// border: Border.all(color: Colors.grey[300]!),
|
||||
// ),
|
||||
// child: Column(
|
||||
// crossAxisAlignment: CrossAxisAlignment.start,
|
||||
// children: [
|
||||
// Text(
|
||||
// title,
|
||||
// style: TextStyle(
|
||||
// fontSize: 12,
|
||||
// color: Colors.grey[600],
|
||||
// ),
|
||||
// ),
|
||||
// const SizedBox(height: 4),
|
||||
// Text(
|
||||
// value,
|
||||
// style: const TextStyle(
|
||||
// fontSize: 16,
|
||||
// fontWeight: FontWeight.bold,
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
|
||||
|
||||
// class EconomyExpandTile extends StatefulWidget {
|
||||
// @override
|
||||
// _EconomyExpandTileState createState() => _EconomyExpandTileState();
|
||||
// }
|
||||
//
|
||||
// class _EconomyExpandTileState extends State<EconomyExpandTile> {
|
||||
// bool isExpanded = false;
|
||||
//
|
||||
// @override
|
||||
// Widget build(BuildContext context) {
|
||||
// return Card(
|
||||
// elevation: 4,
|
||||
// child: ExpansionTile(
|
||||
// onExpansionChanged: (value) {
|
||||
// setState(() {
|
||||
// isExpanded = value;
|
||||
// });
|
||||
// },
|
||||
// title: Container(
|
||||
// color: Colors.blue,
|
||||
// padding: const EdgeInsets.all(16),
|
||||
// child: Text(
|
||||
// 'ECONOMY',
|
||||
// style: TextStyle(
|
||||
// color: Colors.white,
|
||||
// fontWeight: FontWeight.bold,
|
||||
// fontSize: 18,
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
// backgroundColor: Colors.white,
|
||||
// collapsedBackgroundColor: Colors.blue,
|
||||
// children: [
|
||||
// Padding(
|
||||
// padding: const EdgeInsets.all(16.0),
|
||||
// child: Column(
|
||||
// children: [
|
||||
// buildCategoryTitle('National Accounts'),
|
||||
// buildCardRow([
|
||||
// buildCard('GDP (Constant)', '1.62T', '2022 (AED)'),
|
||||
// buildCard('FDI', '1.45T', '2021 (AED)'),
|
||||
// ]),
|
||||
// buildCategoryTitle('International Trade'),
|
||||
// buildCardRow([
|
||||
// buildCard('Total Trade', '669.9B', 'Jan - Mar 2024 (AED)'),
|
||||
// buildCard('Total Import', '686B', 'Jan - Mar 2024 (AED)'),
|
||||
// ]),
|
||||
// buildCardRow([
|
||||
// buildCard('Total Export', '122.9B', 'Jan - Mar 2024 (AED)'),
|
||||
// buildCard('Total ReExport', '161B', 'Jan - Mar 2024 (AED)'),
|
||||
// ]),
|
||||
// buildCategoryTitle('Prices'),
|
||||
// buildCardRow([
|
||||
// buildCard('Inflation Rate', '215.4B', '2023'),
|
||||
// ]),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
//
|
||||
// Widget buildCategoryTitle(String title) {
|
||||
// return Padding(
|
||||
// padding: const EdgeInsets.symmetric(vertical: 8.0),
|
||||
// child: Text(
|
||||
// title,
|
||||
// style: TextStyle(
|
||||
// fontSize: 16,
|
||||
// fontWeight: FontWeight.bold,
|
||||
// color: Colors.black54,
|
||||
// ),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
//
|
||||
// Widget buildCardRow(List<Widget> cards) {
|
||||
// return SingleChildScrollView(
|
||||
// scrollDirection: Axis.horizontal,
|
||||
// child: Row(
|
||||
// children: cards.map((card) {
|
||||
// return Padding(
|
||||
// padding: const EdgeInsets.symmetric(horizontal: 8.0),
|
||||
// child: card,
|
||||
// );
|
||||
// }).toList(),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
//
|
||||
// Widget buildCard(String title, String value, String subtitle) {
|
||||
// return Card(
|
||||
// elevation: 2,
|
||||
// child: Container(
|
||||
// width: 150, // Fixed width for cards to make scrolling smoother
|
||||
// padding: const EdgeInsets.all(16.0),
|
||||
// child: Column(
|
||||
// mainAxisAlignment: MainAxisAlignment.center,
|
||||
// children: [
|
||||
// Text(
|
||||
// title,
|
||||
// textAlign: TextAlign.center,
|
||||
// style: TextStyle(fontWeight: FontWeight.bold),
|
||||
// ),
|
||||
// SizedBox(height: 8),
|
||||
// Text(
|
||||
// value,
|
||||
// style: TextStyle(
|
||||
// fontSize: 18,
|
||||
// color: Colors.blue,
|
||||
// fontWeight: FontWeight.bold,
|
||||
// ),
|
||||
// ),
|
||||
// SizedBox(height: 8),
|
||||
// Text(
|
||||
// subtitle,
|
||||
// textAlign: TextAlign.center,
|
||||
// style: TextStyle(color: Colors.black54, fontSize: 12),
|
||||
// ),
|
||||
// ],
|
||||
// ),
|
||||
// ),
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
|
||||
class CustomExpandableTile extends StatefulWidget {
|
||||
@override
|
||||
_CustomExpandableTileState createState() => _CustomExpandableTileState();
|
||||
}
|
||||
|
||||
class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
bool isExpanded = false;
|
||||
class uaenumberWidget extends StatelessWidget {
|
||||
const uaenumberWidget({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Card(
|
||||
elevation: 4,
|
||||
child: SingleChildScrollView(
|
||||
child: Column(
|
||||
children: [
|
||||
// The tile header
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
isExpanded = !isExpanded;
|
||||
});
|
||||
},
|
||||
child: Container(
|
||||
color: Colors.blue,
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'ECONOMY',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 18,
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
isExpanded ? Icons.keyboard_arrow_up : Icons.keyboard_arrow_down,
|
||||
color: Colors.white,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
// Animated container for expansion
|
||||
AnimatedContainer(
|
||||
duration: Duration(milliseconds: 300),
|
||||
curve: Curves.easeInOut,
|
||||
height: isExpanded ? null : 0,
|
||||
child: isExpanded
|
||||
? Container(
|
||||
color: Colors.white,
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
children: [
|
||||
buildCategoryTitle('National Accounts'),
|
||||
buildCardRow([
|
||||
buildCard('GDP (Constant)', '1.62T', '2022 (AED)'),
|
||||
buildCard('FDI', '1.45T', '2021 (AED)'),
|
||||
]),
|
||||
buildCategoryTitle('International Trade'),
|
||||
buildCardRow([
|
||||
buildCard('Total Trade', '669.9B', 'Jan - Mar 2024 (AED)'),
|
||||
buildCard('Total Import', '686B', 'Jan - Mar 2024 (AED)'),
|
||||
]),
|
||||
buildCategoryTitle('Prices'),
|
||||
buildCardRow([
|
||||
buildCard('Inflation Rate', '215.4B', '2023'),
|
||||
]),
|
||||
],
|
||||
),
|
||||
)
|
||||
: Container(),
|
||||
),
|
||||
],
|
||||
double myheight = MediaQuery.of(context).size.height;
|
||||
double mywidth = MediaQuery.of(context).size.width;
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: ListView(
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(30.0),
|
||||
border: Border.all(width: 1)
|
||||
|
||||
),
|
||||
child: TextField(
|
||||
decoration: InputDecoration(
|
||||
hintText: "Search",
|
||||
prefixIcon: Icon(Icons.search),
|
||||
border: InputBorder.none,
|
||||
contentPadding: EdgeInsets.symmetric(vertical: 15.0, horizontal: 20.0),
|
||||
),
|
||||
),
|
||||
),
|
||||
SizedBox(height: myheight/35,),
|
||||
CustomExpandableTile(
|
||||
title: 'ECONOMY',
|
||||
titleBackgroundColor: economyColor,
|
||||
children: [
|
||||
buildCategoryTitle('National Accounts',economyColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'GDP (Constant)', '1.62T', '2022 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
buildCard(context,'FDI', '1.45T', '2021 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('International Trade',economyColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Total Trade', '669.9B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
buildCard(context,'Total Import', '686B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
]),
|
||||
buildCardRow([
|
||||
buildCard(context,'Total Export', '669.9B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
buildCard(context,'Total ReExport', '686B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Prices',economyColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Total Export', '669.9B', 'Jan - Mar 2024 (AED)',economyColor,economyColor,mywidth/1.2),
|
||||
]),
|
||||
],
|
||||
),
|
||||
CustomExpandableTile(
|
||||
title: 'SOCIAL',
|
||||
titleBackgroundColor: socialColor,
|
||||
children: [
|
||||
buildCategoryTitle('Population',socialColor),
|
||||
buildCardRow([
|
||||
InkWell(onTap: (){},child: buildCard(context,'Population', '9.89M', '2024',socialColor,socialColor,mywidth/2.5)),
|
||||
buildCard(context,'Population Growth', '2.1%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Vital Statistics',socialColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Marriages', '96%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
buildCard(context,'Divorces', '1.2K', '2024',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Education',socialColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'General Education', '96%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
buildCard(context,'Higher Education', '1.2K', '2024',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Health',socialColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Hospital', '96%', '2023',socialColor,socialColor,mywidth/2.5),
|
||||
buildCard(context,'Clinic and Centres', '1.2K', '2024',socialColor,socialColor,mywidth/2.5),
|
||||
]),
|
||||
],
|
||||
),
|
||||
CustomExpandableTile(
|
||||
title: 'ENVIRONMENT',
|
||||
titleBackgroundColor: environmentColor,
|
||||
children: [
|
||||
buildCategoryTitle('Agriculture',environmentColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Crops - Total Area', '27°C', 'Average 2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Livestock', '120mm', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Environment',environmentColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Climate - Max Temp', '15%', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Climate - Min Temp', '30%', '2023',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
buildCardRow([
|
||||
buildCard(context,'Desalinated Produced Water', '15%', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Area of Natural Reserves', '30%', '2023',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
buildCategoryTitle('Energy',environmentColor),
|
||||
buildCardRow([
|
||||
buildCard(context,'Electricity Production', '15%', '2024',environmentColor,environmentColor,mywidth/2.5),
|
||||
buildCard(context,'Renewable Energy Production', '30%', '2023',environmentColor,environmentColor,mywidth/2.5),
|
||||
]),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget buildCategoryTitle(String title) {
|
||||
Widget buildCategoryTitle(String title,Color color) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 8.0),
|
||||
child: Text(
|
||||
@ -398,7 +136,7 @@ class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.black54,
|
||||
color: color,
|
||||
),
|
||||
),
|
||||
);
|
||||
@ -410,7 +148,7 @@ class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
child: Row(
|
||||
children: cards.map((card) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8.0),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 2.0),
|
||||
child: card,
|
||||
);
|
||||
}).toList(),
|
||||
@ -418,11 +156,21 @@ class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
);
|
||||
}
|
||||
|
||||
Widget buildCard(String title, String value, String subtitle) {
|
||||
Widget buildCard(BuildContext context,String title, String value, String subtitle,Color bordercolor,boldColor,double mywidth) {
|
||||
// double myheight = MediaQuery.of(context).size.height;
|
||||
// double mywidth = MediaQuery.of(context).size.width;
|
||||
return Card(
|
||||
elevation: 2,
|
||||
child: Container(
|
||||
width: 150,
|
||||
width: mywidth,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white, // Background color
|
||||
border: Border.all(
|
||||
color: bordercolor, // Border color
|
||||
width: 2, // Border width
|
||||
),
|
||||
borderRadius: BorderRadius.circular(12), // Optional: Rounded corners
|
||||
),
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
@ -430,26 +178,115 @@ class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
Text(
|
||||
title,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(fontWeight: FontWeight.bold),
|
||||
style: robotoRegular11,
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Text(
|
||||
subtitle,
|
||||
textAlign: TextAlign.center,
|
||||
style: subtitleStyle
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Text(
|
||||
value,
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
color: Colors.blue,
|
||||
fontSize: 26,
|
||||
color: boldColor,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
SizedBox(height: 8),
|
||||
Text(
|
||||
subtitle,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(color: Colors.black54, fontSize: 12),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class CustomExpandableTile extends StatefulWidget {
|
||||
final String title;
|
||||
final Color titleBackgroundColor;
|
||||
final List<Widget> children;
|
||||
|
||||
const CustomExpandableTile({
|
||||
required this.title,
|
||||
required this.titleBackgroundColor,
|
||||
required this.children,
|
||||
});
|
||||
|
||||
@override
|
||||
_CustomExpandableTileState createState() => _CustomExpandableTileState();
|
||||
}
|
||||
|
||||
class _CustomExpandableTileState extends State<CustomExpandableTile> {
|
||||
bool isExpanded = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
double myheight = MediaQuery.of(context).size.height;
|
||||
return Card(
|
||||
elevation: 4,
|
||||
child: Column(
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
isExpanded = !isExpanded;
|
||||
});
|
||||
},
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: widget.titleBackgroundColor,
|
||||
borderRadius: BorderRadius.all(Radius.circular(12))
|
||||
),
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
widget.title,
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 18,
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
isExpanded
|
||||
? Icons.keyboard_arrow_up
|
||||
: Icons.keyboard_arrow_down,
|
||||
color: Colors.white,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
ClipRRect(
|
||||
child: AnimatedContainer(
|
||||
duration: Duration(milliseconds: 300),
|
||||
curve: Curves.easeInOut,
|
||||
width: double.infinity,
|
||||
height: isExpanded ? myheight : 0,
|
||||
child: isExpanded
|
||||
? SingleChildScrollView(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.all(Radius.circular(20))
|
||||
),
|
||||
|
||||
padding: const EdgeInsets.all(10),
|
||||
child: Column(
|
||||
children: widget.children,
|
||||
),
|
||||
),
|
||||
)
|
||||
: null,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user