日历增加padding和margin属性

日历高度自适应
日历item大小计算问题
develop^2
LXD312569496 5 years ago committed by xiaodong
parent dafc20dd39
commit cac3b44b33

@ -0,0 +1,253 @@
import 'package:flutter/material.dart';
import 'package:flutter_custom_calendar/flutter_custom_calendar.dart';
import 'package:flutter_custom_calendar/style/style.dart';
import 'package:random_pk/random_pk.dart';
/**
*
*/
class BlueStylePage extends StatefulWidget {
BlueStylePage({Key key, this.title}) : super(key: key);
final String title;
@override
_BlueStylePageState createState() => _BlueStylePageState();
}
class _BlueStylePageState extends State<BlueStylePage> {
ValueNotifier<String> text;
ValueNotifier<String> selectText;
CalendarController controller;
Map<DateModel, String> customExtraData = {};
@override
void initState() {
controller = new CalendarController(
weekBarItemWidgetBuilder: () {
return CustomStyleWeekBarItem();
},
dayWidgetBuilder: (dateModel) {
return CustomStyleDayWidget(dateModel);
},
showMode: Constants.MODE_SHOW_MONTH_AND_WEEK,
extraDataMap: customExtraData);
controller.addMonthChangeListener(
(year, month) {
text.value = "$year$month";
},
);
controller.addOnCalendarSelectListener((dateModel) {
//
selectText.value =
"单选模式\n选中的时间:\n${controller.getSingleSelectCalendar()}";
});
text = new ValueNotifier("${DateTime.now().year}${DateTime.now().month}");
selectText = new ValueNotifier(
"单选模式\n选中的时间:\n${controller.getSingleSelectCalendar()}");
}
@override
Widget build(BuildContext context) {
var calendarWidget = CalendarViewWidget(
calendarController: controller,
boxDecoration: BoxDecoration(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20), bottomRight: Radius.circular(20)),
color: Colors.white,
),
padding: EdgeInsets.only(left: 20, right: 20, bottom: 10),
margin: const EdgeInsets.only(
left: 15,
right: 15,
),
);
return SafeArea(
child: Scaffold(
appBar: AppBar(
backgroundColor: Color(0xff6219EC),
),
backgroundColor: Color(0xff6219EC),
body: new Container(
child: new Column(
children: <Widget>[
SizedBox(
height: 20,
),
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Container(
height: 100,
margin: const EdgeInsets.only(left: 15, right: 15),
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
color: Colors.white),
child: Row(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(left: 30),
child: RichText(
text: TextSpan(
children: [
TextSpan(
text: "Februaly",
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w700,
fontSize: 30),
),
TextSpan(
text: " 2019",
style: TextStyle(
color: Colors.black, fontSize: 30),
),
],
),
),
),
],
),
),
calendarWidget
],
),
ValueListenableBuilder(
valueListenable: selectText,
builder: (context, value, child) {
return new Text(selectText.value);
}),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
controller.toggleExpandStatus();
},
tooltip: 'Increment',
child: Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
),
);
}
}
class CustomStyleWeekBarItem extends BaseWeekBar {
List<String> weekList = ["mo", "tu", "we", "th", "fr", "sa", "su"];
//build
@override
Widget build(BuildContext context) {
List<Widget> children = List();
var items = getWeekDayWidget();
children.add(Row(
children: items,
));
children.add(Divider(
color: Colors.grey,
));
return Column(
children: children,
);
}
@override
Widget getWeekBarItem(int index) {
return new Container(
margin: EdgeInsets.only(top: 10, bottom: 10),
child: new Center(
child: new Text(
weekList[index],
style:
TextStyle(fontWeight: FontWeight.w700, color: Color(0xffC5BCDC)),
),
),
);
}
}
class CustomStyleDayWidget extends BaseCombineDayWidget {
CustomStyleDayWidget(DateModel dateModel) : super(dateModel);
TextStyle normalTextStyle =
TextStyle(fontWeight: FontWeight.w700, color: Colors.black);
TextStyle noIsCurrentMonthTextStyle =
TextStyle(fontWeight: FontWeight.w700, color: Colors.grey);
@override
Widget getNormalWidget(DateModel dateModel) {
return Container(
margin: EdgeInsets.all(8),
child: new Stack(
alignment: Alignment.center,
children: <Widget>[
new Column(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
//
new Expanded(
child: Center(
child: new Text(
dateModel.day.toString(),
style: dateModel.isCurrentMonth
? normalTextStyle
: noIsCurrentMonthTextStyle,
),
),
),
],
),
],
),
);
}
@override
Widget getSelectedWidget(DateModel dateModel) {
return Container(
// margin: EdgeInsets.all(8),
decoration: new BoxDecoration(
borderRadius: BorderRadius.all(
Radius.circular(5),
),
color: Color(0xffFED32B),
),
child: new Stack(
alignment: Alignment.center,
children: <Widget>[
new Column(
mainAxisSize: MainAxisSize.max,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
//
new Expanded(
child: Center(
child: new Text(
dateModel.day.toString(),
style: dateModel.isCurrentMonth
? normalTextStyle
: noIsCurrentMonthTextStyle,
),
),
),
],
),
],
),
);
}
}

@ -113,6 +113,7 @@ class _CustomSignPageState extends State<CustomSignPage> {
floatingActionButton: FloatingActionButton(
onPressed: () {
controller.toggleExpandStatus();
// controller.changeExtraData({});
},
tooltip: 'Increment',
child: Icon(Icons.add),

@ -24,10 +24,10 @@ class _DefaultStylePageState extends State<DefaultStylePage> {
DateTime now = DateTime.now();
controller = new CalendarController(
minYear: now.year,
minYearMonth: now.month - 2,
minYearMonth: now.month - 5,
maxYear: now.year,
maxYearMonth: now.month + 1,
showMode: Constants.MODE_SHOW_WEEK_AND_MONTH);
maxYearMonth: now.month + 5,
showMode: Constants.MODE_SHOW_MONTH_AND_WEEK);
controller.addMonthChangeListener(
(year, month) {

@ -1,6 +1,7 @@
import 'package:example/only_week_page.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'blue_style_page.dart';
import 'custom_sign_page.dart';
import 'custom_style_page.dart';
import 'default_style_page.dart';
@ -39,6 +40,9 @@ class MyApp extends StatelessWidget {
"/only_week_view": (context) => OnlyWeekPage(
title: "仅显示周视图",
),
"/blue_style_page":(context)=>BlueStylePage(
title:"蓝色背景Demo"
)
},
title: 'Flutter Demo',
theme: ThemeData(
@ -91,9 +95,74 @@ class HomePage extends StatelessWidget {
},
child: new Text("仅显示周视图"),
),
new RaisedButton(onPressed: (){
Navigator.pushNamed(context, "/blue_style_page");
},child: new Text("蓝色Demo"),)
],
),
),
);
}
}
//
//# Desktop Flutter Example
//
//This is the standard Flutter template application, modified to run on desktop.
//
//The `linux` and `windows` directories serve as early prototypes of
//what will eventually become the `flutter create` templates for desktop, and will
//be evolving over time to better reflect that goal. The `macos` directory has
//now become a `flutter create` template, so is largely identical to what that
//command creates.
//
//## Building and Running
//
//See [the main project README](../README.md).
//
//To build without running, use `flutter build macos`/`windows`/`linux` rather than `flutter run`, as with
//a standard Flutter project.
//
//## Dart Differences from Flutter Template
//
//The `main.dart` and `pubspec.yaml` have minor changes to support desktop:
//* `debugDefaultTargetPlatformOverride` is set to avoid 'Unknown platform'
//exceptions.
//* The font is explicitly set to Roboto, and Roboto is bundled via
//`pubspec.yaml`, to ensure that text displays on all platforms.
//
//See the [Flutter Application Requirements section of the Flutter page on
//desktop support](https://github.com/flutter/flutter/wiki/Desktop-shells#flutter-application-requirements)
//for more information.
//
//## Adapting for Another Project
//
//Since `flutter create` is not yet supported for Windows and Linux, the easiest
//way to try out desktop support with an existing Flutter application on those
//platforms is to copy the platform directories from this example; see below for
//details. For macOS, just run `flutter create --macos .` in your project.
//
//Be sure to read the [Flutter page on desktop
//support](https://github.com/flutter/flutter/wiki/Desktop-shells) before trying to
//run an existing project on desktop, especially the [Flutter Application Requirements
//section](https://github.com/flutter/flutter/wiki/Desktop-shells#flutter-application-requirements).
//
//### Coping the Desktop Runners
//
//The 'linux' and 'windows' directories are self-contained, and can be copied to
//an existing Flutter project, enabling `flutter run` for those platforms.
//
//**Be aware that neither the API surface of the Flutter desktop libraries nor the
//interaction between the `flutter` tool and the platform directories is stable,
//and no attempt will be made to provide supported migration paths as things
//change.** You should expect that every time you update Flutter you may have
//to delete your copies of the platform directories and re-copy them from an
//updated version of flutter-desktop-embedding.
//
//### Customizing the Runners
//
//See [Application Customization](App-Customization.md) for premilinary
//documenation on modifying basic application information like name and icon.
//
//If you are building for macOS, you should also read about [managing macOS
//security configurations](../macOS-Security.md).

@ -21,6 +21,15 @@ class CalendarProvider extends ChangeNotifier {
double get totalHeight => _totalHeight;
ValueNotifier<int> _generation =
new ValueNotifier(0); //int
ValueNotifier<int> get generation => _generation;
set generation(ValueNotifier<int> value) {
_generation = value;
}
set totalHeight(double value) {
_totalHeight = value;
}
@ -95,27 +104,64 @@ class CalendarProvider extends ChangeNotifier {
//
CalendarConfiguration calendarConfiguration;
void initData(
{Set<DateModel> selectedDateList,
DateModel selectDateModel,
CalendarConfiguration calendarConfiguration}) {
void initData({
Set<DateModel> selectedDateList,
DateModel selectDateModel,
CalendarConfiguration calendarConfiguration,
EdgeInsetsGeometry padding,
EdgeInsetsGeometry margin,
}) {
LogUtil.log(TAG: this.runtimeType, message: "CalendarProvider initData");
if (selectedDateList != null) {
this.selectedDateList.addAll(selectedDateList);
}
this.selectDateModel = selectDateModel;
this.calendarConfiguration = calendarConfiguration;
this.calendarConfiguration.padding = padding;
this.calendarConfiguration.margin = margin;
//lastClickDateModelitem
this.lastClickDateModel = selectDateModel != null
? selectDateModel
: DateModel.fromDateTime(DateTime.now())
..day = 15;
//
if (calendarConfiguration.showMode == Constants.MODE_SHOW_ONLY_WEEK ||
calendarConfiguration.showMode == Constants.MODE_SHOW_WEEK_AND_MONTH) {
expandStatus = ValueNotifier(false);
} else {
expandStatus = ValueNotifier(true);
}
//itemitemSize/7/7paddingmargin
if (calendarConfiguration.itemSize == null) {
MediaQueryData mediaQueryData =
MediaQueryData.fromWindow(WidgetsBinding.instance.window);
if (mediaQueryData.orientation == Orientation.landscape) {
calendarConfiguration.itemSize = (mediaQueryData.size.height -
calendarConfiguration.padding.horizontal -
calendarConfiguration.margin.horizontal) /
7;
} else {
calendarConfiguration.itemSize = (mediaQueryData.size.width -
calendarConfiguration.padding.horizontal -
calendarConfiguration.margin.horizontal) /
7;
}
} else {
//itemSizeitemSize
}
//
if (calendarConfiguration.showMode == Constants.MODE_SHOW_ONLY_MONTH ||
calendarConfiguration.showMode == Constants.MODE_SHOW_MONTH_AND_WEEK) {
int lineCount = DateUtil.getMonthViewLineCount(
calendarConfiguration.nowYear, calendarConfiguration.nowMonth);
totalHeight = calendarConfiguration.itemSize * (lineCount) +
calendarConfiguration.verticalSpacing * (lineCount - 1);
print(
"1111111:totalHeight:$totalHeight,lineCount:$lineCount,calendarConfiguration.nowYear:${calendarConfiguration.nowYear},calendarConfiguration.nowMonth:${calendarConfiguration.nowMonth}");
} else {
totalHeight = calendarConfiguration.itemSize;
}
}
//退

@ -1,6 +1,7 @@
import 'package:flutter/material.dart';
import 'package:flutter_custom_calendar/controller.dart';
import 'package:flutter_custom_calendar/model/date_model.dart';
import 'package:flutter/foundation.dart';
/**
*
@ -43,6 +44,8 @@ class CalendarConfiguration {
double verticalSpacing; //item10
BoxDecoration boxDecoration; //
double itemSize; ///7
EdgeInsetsGeometry padding;
EdgeInsetsGeometry margin;
//
DayWidgetBuilder dayWidgetBuilder; //item
@ -52,11 +55,14 @@ class CalendarConfiguration {
*
*/
//
OnMonthChange monthChange; //
OnMonthChange monthChange; // ,multiMonthChanges
OnCalendarSelect calendarSelect; //
OnMultiSelectOutOfRange multiSelectOutOfRange; //
OnMultiSelectOutOfSize multiSelectOutOfSize; //
ObserverList<OnMonthChange> monthChangeListeners =
ObserverList<OnMonthChange>(); //
/**
*
*/
@ -87,7 +93,10 @@ class CalendarConfiguration {
this.monthController,
this.weekController,
this.verticalSpacing,
this.itemSize,this.showMode});
this.itemSize,
this.showMode,
this.padding,
this.margin});
@override
String toString() {

@ -39,8 +39,8 @@ class CalendarController {
int maxYear = 2055,
int minYearMonth = 1,
int maxYearMonth = 12,
int nowYear = -1,
int nowMonth = -1,
int nowYear,
int nowMonth,
int minSelectYear = 1971,
int minSelectMonth = 1,
int minSelectDay = 1,
@ -54,6 +54,13 @@ class CalendarController {
double itemSize,
Map<DateModel, Object> extraDataMap = EMPTY_MAP}) {
LogUtil.log(TAG: this.runtimeType, message: "init CalendarConfiguration");
//
if (nowYear == null) {
nowYear = DateTime.now().year;
}
if (nowMonth == null) {
nowMonth = DateTime.now().month;
}
calendarConfiguration = CalendarConfiguration(
selectMode: selectMode,
showMode: showMode,
@ -181,7 +188,8 @@ class CalendarController {
//
void addMonthChangeListener(OnMonthChange listener) {
this.calendarConfiguration.monthChange = listener;
// this.calendarConfiguration.monthChange = listener;
this.calendarConfiguration.monthChangeListeners.add(listener);
}
//
@ -233,9 +241,11 @@ class CalendarController {
} else {
calendarProvider.calendarConfiguration.monthController
.previousPage(duration: DEFAULT_DURATION, curve: Curves.ease);
calendarProvider.calendarConfiguration.monthChange(
monthList[currentIndex - 1].year,
monthList[currentIndex - 1].month);
calendarProvider.calendarConfiguration.monthChangeListeners
.forEach((listener) {
listener(monthList[currentIndex - 1].year,
monthList[currentIndex - 1].month);
});
DateModel temp = new DateModel();
temp.year = monthList[currentIndex].year;
temp.month = monthList[currentIndex].month;
@ -272,9 +282,12 @@ class CalendarController {
} else {
calendarProvider.calendarConfiguration.monthController
.nextPage(duration: DEFAULT_DURATION, curve: Curves.ease);
calendarProvider.calendarConfiguration.monthChange(
monthList[currentIndex + 1].year,
monthList[currentIndex + 1].month);
calendarProvider.calendarConfiguration.monthChangeListeners
.forEach((listener) {
listener(monthList[currentIndex + 1].year,
monthList[currentIndex + 1].month);
});
DateModel temp = new DateModel();
temp.year = monthList[currentIndex].year;
temp.month = monthList[currentIndex].month;

@ -19,11 +19,19 @@ class CalendarViewWidget extends StatefulWidget {
//
BoxDecoration boxDecoration;
//paddingmargin
EdgeInsetsGeometry padding;
EdgeInsetsGeometry margin;
//
final CalendarController calendarController;
CalendarViewWidget(
{Key key, @required this.calendarController, this.boxDecoration})
{Key key,
@required this.calendarController,
this.boxDecoration,
this.padding = EdgeInsets.zero,
this.margin = EdgeInsets.zero})
: super(key: key);
@override
@ -35,7 +43,9 @@ class _CalendarViewWidgetState extends State<CalendarViewWidget> {
void initState() {
//provider
widget.calendarController.calendarProvider.initData(
calendarConfiguration: widget.calendarController.calendarConfiguration);
calendarConfiguration: widget.calendarController.calendarConfiguration,
padding: widget.padding,
margin: widget.margin);
super.initState();
}
@ -53,6 +63,8 @@ class _CalendarViewWidgetState extends State<CalendarViewWidget> {
child: Container(
//
decoration: widget.boxDecoration,
padding: widget.padding,
margin: widget.margin,
//使constsetStatewidget
child: CalendarContainer(widget.calendarController)),
);
@ -128,47 +140,32 @@ class CalendarContainerState extends State<CalendarContainer>
}
});
});
}else{
index=0;
} else {
index = 0;
}
// widget.calendarController.addMonthChangeListener((year, month) {
// if (widget.calendarController.calendarProvider.calendarConfiguration
// .showMode !=
// Constants.MODE_SHOW_ONLY_WEEK) {
// //setState使
// int lineCount = DateUtil.getMonthViewLineCount(year, month);
// double newHeight = itemHeight * lineCount +
// calendarProvider.calendarConfiguration.verticalSpacing *
// (lineCount - 1);
// if (totalHeight.toInt() != newHeight.toInt()) {
// LogUtil.log(
// TAG: this.runtimeType,
// message: "totalHeight:$totalHeight,newHeight:$newHeight");
//
// LogUtil.log(TAG: this.runtimeType, message: "月份视图高度发生变化");
// setState(() {
// totalHeight = newHeight;
// });
// }
// }
// });
//,,:a horizontal viewport was given an unlimited amount of I/flutter ( 6759): vertical space in which to expand.
MediaQueryData mediaQueryData =
MediaQueryData.fromWindow(WidgetsBinding.instance.window);
//itemSize/7/7
itemHeight = calendarProvider.calendarConfiguration.itemSize != null
? calendarProvider.calendarConfiguration.itemSize
: mediaQueryData.orientation == Orientation.landscape
? mediaQueryData.size.height / 7
: mediaQueryData.size.width / 7;
calendarProvider.totalHeight = itemHeight * 6 +
calendarProvider.calendarConfiguration.verticalSpacing * (6 - 1);
widget.calendarController.addMonthChangeListener((year, month) {
if (widget.calendarController.calendarProvider.calendarConfiguration
.showMode !=
Constants.MODE_SHOW_ONLY_WEEK) {
//setState使
int lineCount = DateUtil.getMonthViewLineCount(year, month);
double newHeight = itemHeight * (lineCount) +
calendarProvider.calendarConfiguration.verticalSpacing *
(lineCount - 1);
LogUtil.log(
TAG: this.runtimeType,
message: "totalHeight:$totalHeight,newHeight:$newHeight");
if (totalHeight.toInt() != newHeight.toInt()) {
LogUtil.log(TAG: this.runtimeType, message: "月份视图高度发生变化");
setState(() {
totalHeight = newHeight;
});
}
}
});
itemHeight = calendarProvider.calendarConfiguration.itemSize;
totalHeight = calendarProvider.totalHeight;
}
@ -180,9 +177,6 @@ class CalendarContainerState extends State<CalendarContainer>
@override
Widget build(BuildContext context) {
LogUtil.log(TAG: this.runtimeType, message: "CalendarContainerState build");
//,,:a horizontal viewport was given an unlimited amount of I/flutter ( 6759): vertical space in which to expand.
// itemHeight = calendarProvider.calendarConfiguration.itemSize ??
// MediaQuery.of(context).size.width / 7;
return Container(
width: itemHeight * 7,
child: new Column(

@ -117,6 +117,7 @@ class _MonthViewState extends State<MonthView>
return new GridView.builder(
addAutomaticKeepAlives: true,
padding: EdgeInsets.zero,
physics: const NeverScrollableScrollPhysics(),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 7, mainAxisSpacing: configuration.verticalSpacing),

@ -15,7 +15,8 @@ class MonthViewPager extends StatefulWidget {
_MonthViewPagerState createState() => _MonthViewPagerState();
}
class _MonthViewPagerState extends State<MonthViewPager> with AutomaticKeepAliveClientMixin{
class _MonthViewPagerState extends State<MonthViewPager>
with AutomaticKeepAliveClientMixin {
CalendarProvider calendarProvider;
@override
@ -71,7 +72,9 @@ class _MonthViewPagerState extends State<MonthViewPager> with AutomaticKeepAlive
}
//
DateModel dateModel = configuration.monthList[position];
configuration.monthChange(dateModel.year, dateModel.month);
configuration.monthChangeListeners.forEach((listener) {
listener(dateModel.year, dateModel.month);
});
//
if (calendarProvider.lastClickDateModel != null ||
calendarProvider.lastClickDateModel.month != dateModel.month) {
@ -81,24 +84,6 @@ class _MonthViewPagerState extends State<MonthViewPager> with AutomaticKeepAlive
temp.day = configuration.monthList[position].day + 14;
calendarProvider.lastClickDateModel = temp;
}
//使PageView
if (calendarProvider.calendarConfiguration.showMode !=
Constants.MODE_SHOW_ONLY_WEEK) {
//setState使
// int lineCount =
// DateUtil.getMonthViewLineCount(dateModel.year, dateModel.month);
// double newHeight = (calendarProvider.calendarConfiguration.itemSize ??
// MediaQuery.of(context).size.width / 7) *
// lineCount +
// calendarProvider.calendarConfiguration.verticalSpacing *
// (lineCount - 1);
// if (calendarProvider.totalHeight.toInt() != newHeight.toInt()) {
// LogUtil.log(TAG: this.runtimeType, message: "月份视图高度发生变化");
// calendarProvider.totalHeight = newHeight;
//// calendarProvider.changeTotalHeight(newHeight);
// }
}
},
controller: configuration.monthController,
itemBuilder: (context, index) {

@ -14,7 +14,8 @@ class WeekViewPager extends StatefulWidget {
_WeekViewPagerState createState() => _WeekViewPagerState();
}
class _WeekViewPagerState extends State<WeekViewPager> with AutomaticKeepAliveClientMixin{
class _WeekViewPagerState extends State<WeekViewPager>
with AutomaticKeepAliveClientMixin {
int lastMonth; //
CalendarProvider calendarProvider;
@ -64,8 +65,9 @@ class _WeekViewPagerState extends State<WeekViewPager> with AutomaticKeepAliveCl
TAG: this.runtimeType,
message:
"WeekViewPager PageView monthChange:currentMonth:${currentMonth}");
configuration.monthChange(
firstDayOfWeek.year, firstDayOfWeek.month);
configuration.monthChangeListeners.forEach((listener) {
listener(firstDayOfWeek.year, firstDayOfWeek.month);
});
lastMonth = currentMonth;
if (calendarProvider.lastClickDateModel == null ||
calendarProvider.lastClickDateModel.month != currentMonth) {

Loading…
Cancel
Save