Build > Build Solution - Guruh: 652-21 Nazariy qism: Listview, Button va menular haqida ma’lumot

|
Guruh: 652-21 Nazariy qism: Listview, Button va menular haqida ma’lumot
|
bet | 2/2 | Sana | 15.05.2024 | Hajmi | 0,65 Mb. | | #234342 |
Bog'liq 3 - topshiriq aBuild > Build Solution menyusidan foydalanib loyihani kompilyatsiya qilamiz. Output oynasida kompilyatsiya jarayon haqida ma’lumot ko’rsatiladi.
Debug > Start Without Debuggamiz menyusidan foydalanib dasturni ishga tushiramiz. Yangi forma ochiladi va uning o’rtasida button joylashgan. buttonni bosganda label ko’rinib ketadi yoki yashirin bo’ladi.
Buttonlar - grafik interfeysnamiz asosiy elementlari bo'lib, ular foydalanuvchiga dasturlar bilan interaktiv muloqot imkoniyatini beradi. Visual C++/CLR dasturlash tilida buttonlar yaratish uchun yuqoridagi qadamlar amalga oshiriladi. Buttonlarnamiz yana bir qancha xususiyatlari va imkoniyatlari mavjud. Quyida ulardan ba'zilari haqida ma'lumot beriladi:
BackColor: Buttonnamiz orqa fon raymizini o'zgartirish uchun BackColor xususiyati ishlatiladi.
Font: Buttonnamiz shriftini o'zgartirish uchun Font xususiyati ishlatiladi.
Enabled: Buttonni faol yoki nofaol holatda ko'rsatish uchun Enabled xususiyati ishlatiladi.
Image: Buttonda matn o'rniga rasm ko'rsatish uchun Image xususiyati ishlatiladi.
FlatStyle: Buttonnamiz dizayni (tugma konturlari va bosilganda chiqqan effektlari) o'zgartirish uchun FlatStyle xususiyati ishlatiladi.
Anchor: Buttonni forma o'zgarishiga qarshi ochiq yoki yopiq joylashuvda saqlash uchun Anchor xususiyati ishlatiladi.
Cursor: Button ustida sichqoncha paydo bo'lganda sichqoncha ko'rsatkichini o'zgartirish uchun Cursor xususiyati ishlatiladi.
Paddamiz: Button ichidagi matn yoki rasmga chegaralar o'zgartirish uchun Paddamiz xususiyati ishlatiladi.
Buttonlar bilan ishlashda, ularnamiz xususiyatlari va hodisalari juda muhim ahamiyatga ega. Yuqoridagi misol kodlari va ma'lumotlar orqali biz buttonlarnamiz turli xususiyatlarini o'rganib, ularni o'z dasturlaramizizda qulaylik bilan ishlatishamiziz mumkin. Buttonlar har xil vazifalar bajarishga qodir, shuning uchun ular dasturlashda eng ko'p ishlatiladigan elementlardan biri hisoblanadi.
Biznamiz dasturda ham buttonlar har bir formada ishlatilgan. Kirish formasida 2ta buttondan foydalanilgan. Birinchi button Tozalash ya’ni matn qutisidagi ma’lumotlarni tozalash uchun ishlatiladi. Ikkinchi button Kirish nomli button bo’lib, bu foydalanuvchinamiz IDsi va Parolini tekshiradi va agar to’g’ri bo’lsa keyamizi sahifaga o’tkazadi, noto’g’ri bo’lsa ID yoki Parol noto’g’riligi haqida xabar chiqadi. Bu funksionallikni qo’shish uchun Tozalash tugmasini ustiga ikki marta chertamiz va quyidagi kodni yozamiz:
private: System::Void button2_Click(System::Object^ sender, System::EventArgs^ e) {
textBox1->Text = "";
textBox2->Text = "";
}
Amaliy qism:
X ulosa:
Dastur kodi:
, [19.04.2024 19:21]
import 'package:first_app/models/model.dart';
import 'package:first_app/in_page.dart';
import 'package:first_app/widgets/my_card.dart';
import 'package:flutter/material.dart';
import 'models/about.dart';
class CarMarket extends StatelessWidget {
const CarMarket({super.key});
@override
Widget build(BuildContext context) {
List list = [
Vehical(
model: "Daewoo Gentra",
color: "white",
cost: 18000,
imgURL: "https://134706.selcdn.ru/v1/SEL_39171/site-production-public/system/image/file/9005514/vehicle_slider_2%402x.jpg",
maxSpeed: 220),
Vehical(
model: "Audi A6",
color: "grey",
cost: 50000,
imgURL:
"https://upload.wikimedia.org/wikipedia/commons/thumb/f/f4/Audi_A6_50_TDI_Quattro_Premium_C8_Daytona_Gray_Pearl_%2831%29.jpg/800px-Audi_A6_50_TDI_Quattro_Premium_C8_Daytona_Gray_Pearl_%2831%29.jpg",
maxSpeed: 300),
Vehical(
model: "Volkswagen Polo",
color: "red",
cost: 50000,
imgURL:
"https://imgd.aeplcdn.com/664x374/n/cw/ec/29628/polo-exterior-right-front-three-quarter-2.jpeg?q=80",
maxSpeed: 270)
];
return Scaffold(
drawer: const Drawer(),
appBar: AppBar(
backgroundColor: Colors.blue,
title: const Text(
"Avtoelon",
style: TextStyle(color: Colors.white),
),
),
body: ListView(
children: [
MyCard(
vehical: list[0],
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => InPage(
vehical: list[0],
about: list2[0],
),
));
},
),
MyCard(
vehical: list[1],
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => InPage(
vehical: list[1],
about: list2[1],
),
));
},
),
MyCard(
vehical: list[2],
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => InPage(
vehical: list[2],
about: list2[2],
),
));
},
),
],
),
);
}
}
, [19.04.2024 19:22]
import 'package:first_app/models/model.dart';
import 'package:flutter/material.dart';
class MyCard extends StatelessWidget {
final Vehical vehical;
final GestureTapCallback onTap;
const MyCard({required this.onTap, required this.vehical, super.key});
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: onTap,
child: Card(
elevation: 15,
child: Container(
height: 150,
padding: const EdgeInsets.all(8),
margin: const EdgeInsets.all(8),
child: Row(
children: [
Image.network(
vehical.imgURL,
fit: BoxFit.cover,
width: 150,
height: 100,
),
const SizedBox(
width: 20,
),
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
vehical.model,
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 15),
),
const SizedBox(
height: 15,
),
Text(
"${vehical.color}, ' ${vehical.maxSpeed} km/s ' ${vehical.cost}",
style: const TextStyle(fontSize: 13),
),
],
),
],
),
),
),
);
}
}
, [19.04.2024 19:22]
import 'package:first_app/models/model.dart';
import 'package:first_app/widgets/buttons.dart';
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'models/about.dart';
class InPage extends StatelessWidget {
final Vehical vehical;
final About about;
final TextStyle? style1 = TextStyle(fontSize: 15, color: Colors.grey[400] );
final TextStyle? style2 = TextStyle(fontSize: 15, color: Colors.black);
InPage({required this.about, required this.vehical, super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
automaticallyImplyLeading: false,
leading: IconButton(icon:Icon(Icons.arrow_back,color: Colors.black,), onPressed: (){Navigator.pop(context);}, ),
actions: [
IconButton(
onPressed: () {},
icon: Icon(
Icons.share,
color: Colors.black,
),
),
IconButton(
onPressed: () {},
icon: Icon(
Icons.star_border_purple500_outlined,
color: Colors.black,
),
),
],
backgroundColor: Colors.white,
title: Text(
vehical.model,
style: TextStyle(color: Colors.black),
),
),
body: ListView(
children: [
Column(
children: [
Image.network(vehical.imgURL),
Column(
children: [
Padding(
padding: const EdgeInsets.only(left: 12.0, top: 12.0),
child: Row(
children: [
Text(
"${vehical.cost}",
style: TextStyle(
fontSize: 20, fontWeight: FontWeight.bold),
),
SizedBox(
width: 7,
),
Text("y.e"),
SizedBox(
width: 5,
),
IconButton(
onPressed: () {},
icon: Icon(
FontAwesomeIcons.chevronDown,
size: 15,
))
],
),
),
Padding(
padding: const EdgeInsets.only(
left: 10.0,
bottom: 5,
),
child: Row(
children: [
Text(
"${vehical.model} , ${vehical.maxSpeed} km/s",
style: TextStyle(fontSize: 15),
),
],
),
),
],
),
Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Card(
elevation: 10,
child: ClipRRect(
borderRadius: BorderRadius.circular(20),
child: Container(
width: 310.0,
height: 12.0,
color: Colors.grey[300],
),
)),
),
Padding(
padding: const EdgeInsets.only(top: 30.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text("Shahar",style: style1,),
SizedBox(height: 7,),
Text("Kuzov",style: style1,),
SizedBox(height: 7,),
Text("Uzatish qutisi",style: style1,),
, [19.04.2024 19:22]
SizedBox(height: 7,),
Text("Rangi",style: style1,),
SizedBox(height: 7,),
Text("Uzatma",style: style1,),
SizedBox(height: 7,),
Text("Kami bor",style: style1,),
SizedBox(height: 7,),
Text("Двигатель",style: style1,),
SizedBox(height: 7,),
],
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(about.city,style: style2,),
SizedBox(height: 7,),
Text(about.bodys,style: style2,),
SizedBox(height: 7,),
Text(about.automaticOrmechanic,style: style2,),
SizedBox(height: 7,),
Text(vehical.color,style: style2,),
SizedBox(height: 7,),
Text(about.extention,style: style2,),
SizedBox(height: 7,),
Text(about.toAgree,style: style2,),
SizedBox(height: 7,),
Text(about.engine,style: style2,),
SizedBox(height: 7,),
],
),
],
),
),
],
),
],
),
floatingActionButton: FloatButtons(),
);
}
}
|
| |