Skip to content

Instantly share code, notes, and snippets.

@rayliverified

rayliverified/0RkZFscmCy3EnfGf6xLC.dart

Created December 27, 2024 21:23
Show Gist options
  • Save rayliverified/0080b9820dae353886ce07f9d6153c41 to your computer and use it in GitHub Desktop.
Save rayliverified/0080b9820dae353886ce07f9d6153c41 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
0RkZFscmCy3EnfGf6xLC.dart
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'MyApp Demo',
debugShowCheckedModeBanner: false,
home: IPhone16Pro14(),
);
}
}
class IPhone16Pro14 extends StatefulWidget {
const IPhone16Pro14({super.key});
@override
_IPhone16Pro14State createState() => _IPhone16Pro14State();
}
class _IPhone16Pro14State extends State<IPhone16Pro14> {
int currentNavItemIndex = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
appBar: const AppBar(
title: Text('App Bar'),
elevation: 0,
shadowColor: Colors.black,
surfaceTintColor: Color(0xFF5C69E5),
backgroundColor: Color(0xFF5C69E5),
foregroundColor: Colors.white,
centerTitle: false,
titleTextStyle: TextStyle(
color: Colors.white,
fontSize: 18,
fontFamily: 'Roboto',
),
),
body: Container(
width: 402,
height: 1010,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Colors.white,
),
child: SingleChildScrollView(
physics: const AlwaysScrollableScrollPhysics(),
child: SizedBox(
width: double.infinity,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 289,
top: 55,
child: SizedBox(
width: 92,
height: 51,
child: Text(
'نمو',
style: GoogleFonts.getFont(
'Inter',
color: Colors.white,
fontSize: 36,
),
),
),
),
Positioned(
left: -81,
top: -55,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF255045),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: -125,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFFDFDFDF),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: 36,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2F2970da03-31dc-4cd1-ba16-a3019ceb5adf.png',
width: 402,
height: 152,
fit: BoxFit.contain,
),
),
Positioned(
left: -81,
top: -55,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF255045),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: -125,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFFDFDFDF),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: 152,
child: Container(
width: 402,
height: 722,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Color(0x3AD9D9D9),
),
),
),
Positioned(
left: -81,
top: -55,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF255045),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: -125,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFFDFDFDF),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: 68,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2Fde876038-df8a-48f1-a931-b018e0a1b2c8.png',
width: 402,
height: 138,
fit: BoxFit.contain,
),
),
Positioned(
left: 280,
top: 99,
child: SizedBox(
width: 58,
height: 51,
child: Text(
'نمو',
style: GoogleFonts.getFont(
'Inter',
color: Colors.white,
fontSize: 32,
),
),
),
),
Positioned(
left: 328,
top: 64,
child: Image.network(
'https://storage.googleapis.com/codeless-app.appspot.com/uploads%2Fimages%2F0RkZBkmF_lKAtrcXmXF2%2F01eedc65-8113-4005-ad44-524b35db04a7.png',
width: 57,
height: 63,
fit: BoxFit.contain,
),
),
Positioned(
left: 274,
top: 70,
child: SizedBox(
width: 84,
height: 34,
child: Text(
'NMO',
style: GoogleFonts.getFont(
'Inter',
color: Colors.white,
fontSize: 20,
),
),
),
),
Positioned(
left: -81,
top: -55,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF255045),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: -125,
child: Container(
width: 200,
height: 200,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFFDFDFDF),
borderRadius: BorderRadius.circular(100),
),
),
),
Positioned(
left: 0,
top: 192,
child: Container(
width: 402,
height: 679,
clipBehavior: Clip.hardEdge,
decoration: const BoxDecoration(
color: Color(0x3AD9D9D9),
),
),
),
Positioned(
left: 154,
top: 734,
child: Text(
'\n',
style: GoogleFonts.getFont(
'Inter',
color: Colors.black,
fontSize: 16,
height: 1,
),
),
),
Positioned(
left: 29,
top: 313,
child: Container(
width: 320,
height: 375,
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(
color: const Color(0xFFD9D9D9),
),
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 23,
top: 23,
child: SizedBox(
width: 274,
child: Text(
'رقم الهاتف',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Inter',
color: const Color(0xFF1E1E1E),
fontSize: 16,
height: 1.4,
),
),
),
),
Positioned(
left: 24,
top: 54,
child: Container(
width: 273,
height: 41,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(
color: const Color(0xFFD9D9D9),
),
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 11,
child: SizedBox(
width: 242,
child: Text(
'+966',
style: GoogleFonts.getFont(
'Inter',
color: const Color(0xFFB3B3B3),
fontSize: 16,
height: 1,
),
),
),
)
],
),
),
)
],
),
),
),
Positioned(
left: 121,
top: 523,
child: Container(
width: 52,
height: 40,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 11,
top: 11,
child: Text(
'إلغاء',
style: GoogleFonts.getFont(
'Inter',
color: const Color(0xFF303030),
fontSize: 16,
height: 1,
),
),
)
],
),
),
),
Positioned(
left: 189,
top: 523,
child: Container(
width: 69,
height: 40,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: const Color(0xFF3E7E55),
border: Border.all(
color: const Color(0xFF2C2C2C),
),
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 11,
top: 11,
child: Text(
'التحقق',
style: GoogleFonts.getFont(
'Inter',
color: Colors.grey.shade100,
fontSize: 16,
height: 1,
),
),
)
],
),
),
),
Positioned(
left: 57,
top: 431,
child: SizedBox(
width: 272,
height: 70,
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: -1,
top: -1,
child: SizedBox(
width: 274,
child: Text(
'ادخل رمز التحقق',
textAlign: TextAlign.right,
style: GoogleFonts.getFont(
'Inter',
color: const Color(0xFF1E1E1E),
fontSize: 16,
height: 1.4,
),
),
),
),
Positioned(
left: 0,
top: 30,
child: Container(
width: 273,
height: 41,
clipBehavior: Clip.hardEdge,
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(
color: const Color(0xFFD9D9D9),
),
borderRadius: BorderRadius.circular(8),
),
child: Stack(
clipBehavior: Clip.none,
children: [
Positioned(
left: 15,
top: 11,
child: SizedBox(
width: 242,
child: Text(
'Value',
style: GoogleFonts.getFont(
'Inter',
color: const Color(0xFFB3B3B3),
fontSize: 16,
height: 1,
),
),
),
)
],
),
),
)
],
),
),
)
],
),
),
),
),
bottomNavigationBar: NavigationBarTheme(
data: NavigationBarThemeData(
indicatorColor: const Color(0x12000000),
labelTextStyle: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return const TextStyle(
color: Colors.black,
fontSize: 13,
fontWeight: FontWeight.w600,
fontFamily: 'Roboto',
);
}
return const TextStyle(
color: Colors.black,
fontSize: 13,
fontFamily: 'Roboto',
);
}),
iconTheme: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.selected)) {
return const IconThemeData(
color: Color(0xFF5C69E5),
size: 24,
);
}
return const IconThemeData(
color: Colors.black,
size: 24,
);
}),
labelBehavior: NavigationDestinationLabelBehavior.alwaysShow,
),
child: NavigationBar(
selectedIndex: currentNavItemIndex,
onDestinationSelected: (index) =>
setState(() => currentNavItemIndex = index),
backgroundColor: Colors.grey.shade200,
elevation: 0,
height: 85,
labelBehavior: NavigationDestinationLabelBehavior.alwaysShow,
destinations: const [
NavigationDestination(
icon: Icon(
Icons.home_outlined,
size: 24,
),
selectedIcon: Icon(
Icons.home,
size: 24,
),
label: 'Home',
),
NavigationDestination(
icon: Icon(
Icons.map_outlined,
size: 24,
),
selectedIcon: Icon(
Icons.map,
size: 24,
),
label: 'Trails',
),
NavigationDestination(
icon: Icon(
Icons.explore_outlined,
size: 24,
),
selectedIcon: Icon(
Icons.explore,
size: 24,
),
label: 'Explore',
),
NavigationDestination(
icon: Icon(
Icons.person_outline_rounded,
size: 24,
),
selectedIcon: Icon(
Icons.person,
size: 24,
),
label: 'Profile',
)
],
),
),
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment