Notes
![]() ![]() Notes - notes.io |
void main(){
runApp(
MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(backgroundColor: Colors.black,
appBar: AppBar(
backgroundColor: Colors.black,
title: Row( children: [
Text("Instagram",style: TextStyle(fontWeight: FontWeight.bold,fontSize: 20,color: Colors.white),),
Icon(Icons.keyboard_arrow_down, color: Colors.white ),
SizedBox(width: 280,),
Icon(Icons.favorite,color: Colors.white ),
SizedBox(width: 25,),
Icon(Icons.messenger,color: Colors.white ),
],
),
),
body:ListView(
children: [
// 1.ListView() -> Urt hemjeetei scroll
// 2.SingleChildScrollView()-> Bogino hemjeetei scroll
SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: [
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.black
)
),
Text("Your Story ", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.pink
)
),
Text("Name", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.pink
)
),
Text("Name", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.pink
)
),
Text("Name", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.pink
)
),
Text("Name", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.pink
)
),
Text("Name", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
Column(
children: [
Container(
child: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),
width: 80, height: 80,margin: EdgeInsets.fromLTRB(10, 5, 10, 5),
padding: EdgeInsets.all(3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(50),
color: Colors.pink
)
),
Text("Name", style: TextStyle( fontSize:12,color: Colors.white),),
],
),
],
),
),
//post
SizedBox(height: 15,),
Row(
children: [
SizedBox(width: 10,),
ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 40,fit: BoxFit.cover,),),
SizedBox(width: 10,),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,//hewtee chiglel
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("DrinkMoreWater",style: TextStyle(color: Colors.white, fontSize: 15,fontWeight:FontWeight.bold )),
Text("Suggested for you",style: TextStyle(color: Colors.grey, fontSize: 12)),
],),
SizedBox(width: 280,),
Icon(Icons.more_horiz,size: 32,color: Colors.white),
],
),
SizedBox(height: 15,),
Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 400,fit: BoxFit.cover,),
SizedBox(height: 15,),
Row(children: [
Icon(Icons.favorite_border_outlined,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.message,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.send_rounded,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 320,),
Icon(Icons.bookmark_border,size: 25,color: Colors.white),
],),
SizedBox(height: 10,),
Row(children: [
SizedBox(width: 15,),
Text("mesa.hp",style: TextStyle(color: Colors.white,fontWeight:FontWeight.bold )),
SizedBox(width: 3,),
Text("Mesa Asian Masters ! Updated...",style: TextStyle(color: Colors.white)),
SizedBox(width: 3,),
Text("more",style: TextStyle(color: Colors.grey)),
],),
Row(children: [
SizedBox(width: 15,),
Text("6 minutes ago",style: TextStyle(color: Colors.grey)),
SizedBox(width: 3,),
Text("See translation",style: TextStyle(color: Colors.white)),
],),
SizedBox(height: 15,),
Row(
children: [
SizedBox(width: 10,),
ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 40,fit: BoxFit.cover,),),
SizedBox(width: 10,),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,//hewtee chiglel
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("DrinkMoreWater",style: TextStyle(color: Colors.white, fontSize: 15,fontWeight:FontWeight.bold )),
Text("Suggested for you",style: TextStyle(color: Colors.grey, fontSize: 12)),
],),
SizedBox(width: 280,),
Icon(Icons.more_horiz,size: 32,color: Colors.white),
],
),
SizedBox(height: 15,),
Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 400,fit: BoxFit.cover,),
SizedBox(height: 15,),
Row(children: [
Icon(Icons.favorite_border_outlined,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.message,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.send_rounded,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 320,),
Icon(Icons.bookmark_border,size: 25,color: Colors.white),
],),
SizedBox(height: 10,),
Row(children: [
SizedBox(width: 15,),
Text("mesa.hp",style: TextStyle(color: Colors.white,fontWeight:FontWeight.bold )),
SizedBox(width: 3,),
Text("Mesa Asian Masters ! Updated...",style: TextStyle(color: Colors.white)),
SizedBox(width: 3,),
Text("more",style: TextStyle(color: Colors.grey)),
],),
Row(children: [
SizedBox(width: 15,),
Text("6 minutes ago",style: TextStyle(color: Colors.grey)),
SizedBox(width: 3,),
Text("See translation",style: TextStyle(color: Colors.white)),
],),
SizedBox(height: 15,),
Row(
children: [
SizedBox(width: 10,),
ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 40,fit: BoxFit.cover,),),
SizedBox(width: 10,),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,//hewtee chiglel
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("DrinkMoreWater",style: TextStyle(color: Colors.white, fontSize: 15,fontWeight:FontWeight.bold )),
Text("Suggested for you",style: TextStyle(color: Colors.grey, fontSize: 12)),
],),
SizedBox(width: 280,),
Icon(Icons.more_horiz,size: 32,color: Colors.white),
],
),
SizedBox(height: 15,),
Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 400,fit: BoxFit.cover,),
SizedBox(height: 15,),
Row(children: [
Icon(Icons.favorite_border_outlined,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.message,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.send_rounded,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 320,),
Icon(Icons.bookmark_border,size: 25,color: Colors.white),
],),
SizedBox(height: 10,),
Row(children: [
SizedBox(width: 15,),
Text("mesa.hp",style: TextStyle(color: Colors.white,fontWeight:FontWeight.bold )),
SizedBox(width: 3,),
Text("Mesa Asian Masters ! Updated...",style: TextStyle(color: Colors.white)),
SizedBox(width: 3,),
Text("more",style: TextStyle(color: Colors.grey)),
],),
Row(children: [
SizedBox(width: 15,),
Text("6 minutes ago",style: TextStyle(color: Colors.grey)),
SizedBox(width: 3,),
Text("See translation",style: TextStyle(color: Colors.white)),
],),
SizedBox(height: 15,),
Row(
children: [
SizedBox(width: 10,),
ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 40,fit: BoxFit.cover,),),
SizedBox(width: 10,),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,//hewtee chiglel
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("DrinkMoreWater",style: TextStyle(color: Colors.white, fontSize: 15,fontWeight:FontWeight.bold )),
Text("Suggested for you",style: TextStyle(color: Colors.grey, fontSize: 12)),
],),
SizedBox(width: 280,),
Icon(Icons.more_horiz,size: 32,color: Colors.white),
],
),
SizedBox(height: 15,),
Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 400,fit: BoxFit.cover,),
SizedBox(height: 15,),
Row(children: [
Icon(Icons.favorite_border_outlined,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.message,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.send_rounded,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 320,),
Icon(Icons.bookmark_border,size: 25,color: Colors.white),
],),
SizedBox(height: 10,),
Row(children: [
SizedBox(width: 15,),
Text("mesa.hp",style: TextStyle(color: Colors.white,fontWeight:FontWeight.bold )),
SizedBox(width: 3,),
Text("Mesa Asian Masters ! Updated...",style: TextStyle(color: Colors.white)),
SizedBox(width: 3,),
Text("more",style: TextStyle(color: Colors.grey)),
],),
Row(children: [
SizedBox(width: 15,),
Text("6 minutes ago",style: TextStyle(color: Colors.grey)),
SizedBox(width: 3,),
Text("See translation",style: TextStyle(color: Colors.white)),
],),
SizedBox(height: 15,),
Row(
children: [
SizedBox(width: 10,),
ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 40,fit: BoxFit.cover,),),
SizedBox(width: 10,),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,//hewtee chiglel
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("DrinkMoreWater",style: TextStyle(color: Colors.white, fontSize: 15,fontWeight:FontWeight.bold )),
Text("Suggested for you",style: TextStyle(color: Colors.grey, fontSize: 12)),
],),
SizedBox(width: 280,),
Icon(Icons.more_horiz,size: 32,color: Colors.white),
],
),
SizedBox(height: 15,),
Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 400,fit: BoxFit.cover,),
SizedBox(height: 15,),
Row(children: [
Icon(Icons.favorite_border_outlined,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.message,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.send_rounded,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 320,),
Icon(Icons.bookmark_border,size: 25,color: Colors.white),
],),
SizedBox(height: 10,),
Row(children: [
SizedBox(width: 15,),
Text("mesa.hp",style: TextStyle(color: Colors.white,fontWeight:FontWeight.bold )),
SizedBox(width: 3,),
Text("Mesa Asian Masters ! Updated...",style: TextStyle(color: Colors.white)),
SizedBox(width: 3,),
Text("more",style: TextStyle(color: Colors.grey)),
],),
Row(children: [
SizedBox(width: 15,),
Text("6 minutes ago",style: TextStyle(color: Colors.grey)),
SizedBox(width: 3,),
Text("See translation",style: TextStyle(color: Colors.white)),
],),
SizedBox(height: 15,),
Row(
children: [
SizedBox(width: 10,),
ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 40,fit: BoxFit.cover,),),
SizedBox(width: 10,),
Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,//hewtee chiglel
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("DrinkMoreWater",style: TextStyle(color: Colors.white, fontSize: 15,fontWeight:FontWeight.bold )),
Text("Suggested for you",style: TextStyle(color: Colors.grey, fontSize: 12)),
],),
SizedBox(width: 280,),
Icon(Icons.more_horiz,size: 32,color: Colors.white),
],
),
SizedBox(height: 15,),
Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 40,height: 400,fit: BoxFit.cover,),
SizedBox(height: 15,),
Row(children: [
Icon(Icons.favorite_border_outlined,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.message,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 10,),
Icon(Icons.send_rounded,size: 25,color: Colors.white),
SizedBox(width: 2,),
Text("60",style: TextStyle(color: Colors.white, fontSize: 13)),
SizedBox(width: 320,),
Icon(Icons.bookmark_border,size: 25,color: Colors.white),
],),
SizedBox(height: 10,),
Row(children: [
SizedBox(width: 15,),
Text("mesa.hp",style: TextStyle(color: Colors.white,fontWeight:FontWeight.bold )),
SizedBox(width: 3,),
Text("Mesa Asian Masters ! Updated...",style: TextStyle(color: Colors.white)),
SizedBox(width: 3,),
Text("more",style: TextStyle(color: Colors.grey)),
],),
Row(children: [
SizedBox(width: 15,),
Text("6 minutes ago",style: TextStyle(color: Colors.grey)),
SizedBox(width: 3,),
Text("See translation",style: TextStyle(color: Colors.white)),
],)
],
),
bottomNavigationBar:BottomNavigationBar(
type: BottomNavigationBarType.fixed,
showSelectedLabels: false,
showUnselectedLabels: false,
backgroundColor: Colors.black,
selectedItemColor: Colors.white,
unselectedItemColor: Colors.grey,
items: [
BottomNavigationBarItem(icon: Icon(Icons.home_filled),label: "Home"),
BottomNavigationBarItem(icon: Icon(Icons.search),label: "Search"),
BottomNavigationBarItem(icon: Icon(Icons.add_box_outlined),label: "Post"),
BottomNavigationBarItem(icon: Icon(Icons.slow_motion_video),label: "Reels"),
BottomNavigationBarItem(icon: ClipOval(child: Image.network("https://png.pngtree.com/background/20250116/original/pngtree-full-hd-cb-editing-background-iamge-picture-image_15561102.jpg",width: 20,height: 20,fit: BoxFit.cover,),),label: "Profile"),
],
),
),
)
);
}
![]() |
Notes is a web-based application for online taking notes. You can take your notes and share with others people. If you like taking long notes, notes.io is designed for you. To date, over 8,000,000,000+ notes created and continuing...
With notes.io;
- * You can take a note from anywhere and any device with internet connection.
- * You can share the notes in social platforms (YouTube, Facebook, Twitter, instagram etc.).
- * You can quickly share your contents without website, blog and e-mail.
- * You don't need to create any Account to share a note. As you wish you can use quick, easy and best shortened notes with sms, websites, e-mail, or messaging services (WhatsApp, iMessage, Telegram, Signal).
- * Notes.io has fabulous infrastructure design for a short link and allows you to share the note as an easy and understandable link.
Fast: Notes.io is built for speed and performance. You can take a notes quickly and browse your archive.
Easy: Notes.io doesn’t require installation. Just write and share note!
Short: Notes.io’s url just 8 character. You’ll get shorten link of your note when you want to share. (Ex: notes.io/q )
Free: Notes.io works for 14 years and has been free since the day it was started.
You immediately create your first note and start sharing with the ones you wish. If you want to contact us, you can use the following communication channels;
Email: [email protected]
Twitter: http://twitter.com/notesio
Instagram: http://instagram.com/notes.io
Facebook: http://facebook.com/notesio
Regards;
Notes.io Team