Scribd
Upload
2 views

04_EXP_02.pdf (1)

The document outlines an experiment for designing a Flutter UI that incorporates common widgets, specifically focusing on creating a profile page. It includes code snippets for the main application and the profile page layout, featuring elements such as an app bar, user information, and styling. The objective is to familiarize students with Stateful and Stateless widgets, as well as layout widgets like Column and Row.

Uploaded by

dushyant221104
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

04_EXP_02.pdf (1)

The document outlines an experiment for designing a Flutter UI that incorporates common widgets, specifically focusing on creating a profile page. It includes code snippets for the main application and the profile page layout, featuring elements such as an app bar, user information, and styling. The objective is to familiarize students with Stateful and Stateless widgets, as well as layout widgets like Column and Row.

Uploaded by

dushyant221104
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

Don Bosco Institute of Technology Kurla (W),

Mumbai 400 070

Name : Dushyant Bhagwat


Semester : VI
Roll no. : 04

Experiment No.2

Objective: To design Flutter UI by including common widgets

Prerequisite: -> TheStateful and Stateless Widget

-> Column, Row, Divider, Padding, SizedBox Widgets

Program:

main.dart
import 'package:experiment_01/src/profile_page.dart';

import 'package:flutter/material.dart';

void main() {

runApp(const ProfilePage());

class ProfilePage extends StatelessWidget{

const ProfilePage({super.key});

@override
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070
Widget build(BuildContext context){

return MaterialApp(

theme: ThemeData.dark(useMaterial3: true),

debugShowCheckedModeBanner: false,

home: const ProfilePageScreen(),

);

src/profile_page.dart

import 'package:flutter/material.dart';

class ProfilePageScreen extends StatelessWidget {

const ProfilePageScreen({super.key});

@override

Widget build(BuildContext context) {

final bgColor = const Color(0xFF7B8788);

return Scaffold(

appBar: AppBar(
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070
title: Text(

"Profile Page",

style: TextStyle(

fontSize: 30, color: Colors.black, fontWeight:


FontWeight.bold),

),

centerTitle: true,

backgroundColor: bgColor,

),

body: Padding(

padding: const EdgeInsets.all(28.0),

child: Column(

crossAxisAlignment: CrossAxisAlignment.start,

children: [

Center(

child: CircleAvatar(

radius: 50,

backgroundImage:
AssetImage("assets/images/male_profile.png"),

backgroundColor: Colors.blue[300],

),

),

const SizedBox(

height: 25.0,
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070
),

Text(

'NAME',

style: TextStyle(

color: Colors.grey,

letterSpacing: 2.0,

fontSize: 15,

),

),

const SizedBox(

height: 8.0,

),

Text(

"Niranjan Kumar Yadav",

style: TextStyle(

color: Colors.blue[300],

fontSize: 20,

fontWeight: FontWeight.bold),

),

const SizedBox(

height: 25.0,

),

Text(
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070
'AGE',

style: TextStyle(

color: Colors.grey,

letterSpacing: 2.0,

fontSize: 15,

),

),

const SizedBox(

height: 8.0,

),

Text(

"21",

style: TextStyle(

color: Colors.blue[300],

fontSize: 20,

fontWeight: FontWeight.bold),

),

const SizedBox(

height: 25.0,

),

Text(

'CONTACT',

style: TextStyle(
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070
color: Colors.grey,

letterSpacing: 2.0,

fontSize: 15,

),

),

const SizedBox(

height: 8.0,

),

Text(

"9867977146",

style: TextStyle(

color: Colors.blue[300],

fontSize: 20,

fontWeight: FontWeight.bold),

),

const SizedBox(

height: 25.0,

),

Icon(Icons.email_rounded),

const SizedBox(

height: 8.0,

),

Text(
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070
'[email protected]',

style: TextStyle(

color: Colors.blue[300],

letterSpacing: 2.0,

fontSize: 15,

fontWeight: FontWeight.bold),

],

),

));

Output:
Don Bosco Institute of Technology Kurla (W),
Mumbai 400 070

You might also like