Skip to content

5.2.1 flutter buttons #12

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Likhachev17 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

5.2.1 flutter buttons #12

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions lib/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,11 @@ class _MyAppState extends State<MyApp> {
return MaterialApp(
theme: lightTheme,
debugShowCheckedModeBanner: false,
//home: SightListScreen(),
home: SightDetails(
sight: mocks[6],
),
//home: VisitingScreen(),
// home: SightListScreen(),
// home: SightDetails(
// sight: mocks[6],
// ),
home: VisitingScreen(),
);
}
}
40 changes: 33 additions & 7 deletions lib/ui/screen/res/themes.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,6 @@ final lightTheme = ThemeData.light().copyWith(
scaffoldBackgroundColor: AppColors.white,
buttonColor: AppColors.ltPrimaryColor,
hoverColor: AppColors.white,
floatingActionButtonTheme: FloatingActionButtonThemeData(
backgroundColor: AppColors.ltAccentColor,
foregroundColor: AppColors.ltCardBackground,
),
bottomNavigationBarTheme: BottomNavigationBarThemeData(
backgroundColor: AppColors.white,
unselectedItemColor: AppColors.ltPrimaryColorLight,
Expand All @@ -28,6 +24,23 @@ final lightTheme = ThemeData.light().copyWith(
bodyText1: body1BoldTextStyle,
bodyText2: body2NormalTextStyle,
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
textStyle: titleTextStyle,
primary: AppColors.white,
minimumSize: Size.fromHeight(48.0),
elevation: 0.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0),
),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
primary: AppColors.ltPrimaryColor,
textStyle: body2NormalTextStyle,
),
),
);

final darkTheme = ThemeData.dark().copyWith(
Expand All @@ -52,8 +65,21 @@ final darkTheme = ThemeData.dark().copyWith(
unselectedItemColor: AppColors.inactiveBlack,
selectedItemColor: AppColors.white,
),
buttonTheme: ButtonThemeData(
buttonColor: AppColors.dtPrimaryColorDark,
textTheme: ButtonTextTheme.primary,
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
textStyle: titleTextStyle,
primary: AppColors.dtPrimaryColor,
minimumSize: Size.fromHeight(48.0),
elevation: 0.0,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0),
),
),
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
primary: AppColors.dtPrimaryColor,
textStyle: body2NormalTextStyle,
),
),
);
46 changes: 27 additions & 19 deletions lib/ui/screen/sight_details.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,6 @@
import 'dart:ffi';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:places/domain/sight.dart';
import 'package:places/theme/colors.dart';
Expand Down Expand Up @@ -96,16 +99,17 @@ class _CardDetailsBackButton extends StatelessWidget {
child: SizedBox(
width: 32,
height: 32,
child: FlatButton(
padding: EdgeInsets.all(0),
onPressed: () {},
color: Theme.of(context).hoverColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
child: ElevatedButton(
style: ButtonStyle(
padding: MaterialStateProperty.all(
EdgeInsets.all(0),
),
),
onPressed: () => print('button "back" tapped'),
child: Icon(
Icons.arrow_back_ios_rounded,
size: 15,
color: Theme.of(context).buttonColor,
),
),
),
Expand Down Expand Up @@ -208,21 +212,25 @@ class _CardDetailsDescription extends StatelessWidget {
class _CardDetailsBuildARouteBtn extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FlatButton.icon(
onPressed: () {},
color: Colors.green,
height: 48,
minWidth: double.infinity,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
return ElevatedButton.icon(
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.all(Theme
.of(context)
.accentColor),
),
onPressed: () => print('button "Build a route" tapped'),
icon: SvgPicture.asset(
iconGO,
color: AppColors.white,
),
icon: SvgPicture.asset(iconGO),
label: Text(
AppTexts.buildARouteBtnText,
style: Theme
.of(context)
.textTheme
.bodyText1,
.bodyText1
.copyWith(color: AppColors.white),
),
);
}
Expand All @@ -232,8 +240,8 @@ class _CardDetailsBuildARouteBtn extends StatelessWidget {
class _CardDetailsToScheduleBtn extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FlatButton.icon(
onPressed: () {},
return TextButton.icon(
onPressed: () => print('button "back" tapped'),
icon: SvgPicture.asset(
iconCalendar,
color: AppColors.inactiveBlack,
Expand All @@ -256,8 +264,8 @@ class _CardDetailsToScheduleBtn extends StatelessWidget {
class _CardDetailsToFavoritesBtn extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FlatButton.icon(
onPressed: () {},
return TextButton.icon(
onPressed: () => print('button "To favorites" tapped'),
icon: SvgPicture.asset(
iconHeart,
color: Theme
Expand Down
114 changes: 84 additions & 30 deletions lib/ui/sight_card_widgets/sight_card.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import 'package:places/theme/colors.dart';
import 'package:places/theme/text_styles.dart';
import 'package:places/ui/widgets/network_image_with_loading_indicator';
import 'package:places/theme/custom_icons.dart';
import 'package:places/ui/widgets/sight_card_icon_buttons.dart';

//TODO если место закрыто, выводить worktime, иначе описание
//TODO приделать нормальный worktime вместо заглушки
Expand All @@ -16,31 +17,34 @@ class SightCard extends StatelessWidget {

@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.all(16),
child: Container(
height: 188,
width: double.infinity,
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
color: Theme.of(context).cardColor),
child: AspectRatio(
aspectRatio: 3.0 / 2.0,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_SightCardHeader(
url: sight.url,
type: sight.type,
),
_SightCardName(
name: sight.nameSight,
),
_SightCardDetails(
details: sight.details,
),
],
return InkWell(
onTap: () => print('InkWell sight card tapped'),
child: Padding(
padding: EdgeInsets.all(16),
child: Container(
height: 188,
width: double.infinity,
clipBehavior: Clip.antiAlias,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16),
color: Theme.of(context).cardColor),
child: AspectRatio(
aspectRatio: 3.0 / 2.0,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_SightCardHeader(
url: sight.url,
type: sight.type,
),
_SightCardName(
name: sight.nameSight,
),
_SightCardDetails(
details: sight.details,
),
],
),
),
),
),
Expand All @@ -54,10 +58,18 @@ class _SightCardHeader extends StatelessWidget {
Key key,
@required this.url,
@required this.type,
this.isHeart,
this.isCalendar,
this.isShare,
this.isRemove,
}) : assert(url != null && type != null);

final String url;
final String type;
final bool isHeart;
final bool isCalendar;
final bool isShare;
final bool isRemove;

@override
Widget build(BuildContext context) {
Expand Down Expand Up @@ -86,11 +98,7 @@ class _SightCardHeader extends StatelessWidget {
Positioned(
top: 3,
right: 2,
child: IconButton(
icon: SvgPicture.asset(iconHeart),
color: AppColors.white,
onPressed: () {},
),
child: ButtonsPackOnCard(isHeart: true,),
),
],
);
Expand Down Expand Up @@ -167,3 +175,49 @@ class _SightCardDetails extends StatelessWidget {
);
}
}

// чуть позже доведу до ума переиспользуемую карточку
/// Widget with sets of buttons on the top right card corner. If you need sightCard for SightListScreen, set [true] to bool isHeart.
/// If you need sightCard for visiting_screen(Want to visit), set [true] to isCalendar for a card with the "Calendar" and "Remove" buttons.
/// If you need sightCard for visiting_screen(Visited), set [true] to isShare for a card with the "Share" and "Remove" buttons.
class ButtonsPackOnCard extends StatelessWidget {
final bool isHeart;
final bool isCalendar;
final bool isShare;

const ButtonsPackOnCard({
Key key,
this.isHeart,
this.isCalendar,
this.isShare,
}) : assert(
isHeart != null || (isCalendar != null) || (isShare != null),
);

@override
Widget build(BuildContext context) {
if (isShare == true) {
return Row(
children: [
iconButtonShare,
SizedBox(
width: 15,
),
iconButtonRemove,
],
);
} else if (isCalendar == true) {
return Row(
children: [
iconButtonCalendar,
SizedBox(
width: 15,
),
iconButtonRemove,
],
);
} else {
return iconButtonHeart;
}
}
}
44 changes: 19 additions & 25 deletions lib/ui/widgets/custom_bottom_navigation_bar.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,29 +3,24 @@ import 'package:flutter_svg/flutter_svg.dart';
import 'package:places/theme/custom_icons.dart';
import 'package:places/ui/screen/res/themes.dart';

/// Model of the custom navigation bar
/*
ВОПРОС: как можно избавиться от указания цветов везде? По внутренним ощущениям, выглядит не очень
*/
/// Model of the custom bottom navigation bar

class CustomBottomNavigationBar extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BottomNavigationBar(
onTap: (i) => print('Bottom navigation bar tapped'),
type: BottomNavigationBarType.fixed,
items: [
BottomNavigationBarItem(
icon: SvgPicture.asset(
iconList,
color: Theme
.of(context)
.buttonColor,
color: Theme.of(context).buttonColor,
),
label: '',
activeIcon: SvgPicture.asset(
iconListFull,
color: Theme
.of(context)
.buttonColor,
color: Theme.of(context).buttonColor,
),
),
BottomNavigationBarItem(
Expand Down Expand Up @@ -73,35 +68,34 @@ class CustomBottomNavigationBar extends StatelessWidget {
.buttonColor,
),
),
// _BottomBarIcon(iconName: iconHeart, activeIconName: iconHeartFull,),
// _BottomBarItem(iconName: iconHeart, activeIconName: iconHeartFull),
],
);
}
}

// class _BottomBarIcon extends BottomNavigationBarItem {
// _BottomBarIcon(
// {Key key, @required this.iconName, @required this.activeIconName,})
// : assert(
// icon != null,
// Пытаюсь сделать переиспользуемый элемент, но не очень получается:(
// class _BottomBarItem extends BottomNavigationBarItem {
// String iconName;
// String activeIconName;
// _BottomBarItem({
// Key key,
// @required this.iconName,
// @required this.activeIconName,
// }) : assert(
// iconName != null,
// activeIconName != null,
// );
// final String iconName;
// final String activeIconName;
// final String label = '';
// Color iconColor;
//
// @override
// BottomNavigationBarItem build(BuildContext context) {
// return BottomNavigationBarItem(
// icon: SvgPicture.asset(
// iconName,
// color: Theme.of(context).buttonColor,
// iconHeart,
// // color: Theme.of(context).buttonColor,
// ),
// label: '',
// activeIcon: SvgPicture.asset(
// activeIconName,
// color: Theme.of(context).buttonColor,
// // color: Theme.of(context).buttonColor,
// ),
// );
// }
Expand Down
Loading