Может кто-нибудь помочь мне с фреймворком или что-то еще, чтобы реализовать этот вид виджета календаря во флаттере - PullRequest
0 голосов
/ 25 сентября 2018

from the design

Я хотел бы показать календарь не как диалог.И мне нравится использование, чтобы иметь возможность выбрать интервал даты, как на скриншоте.

Ответы [ 2 ]

0 голосов
/ 25 сентября 2018

Я бы порекомендовал вам не изобретать велосипед и не выбрать один из виджетов календаря сообщества (например, тот ), но в случае, если вам нужно специальное решение, вы можете начать с чего-то действительно простого.Например, если вам нужно выбрать диапазон, вы можете просто взять сетку и несколько таких кнопок:

import 'package:flutter/material.dart';

class CalendarPage extends StatefulWidget {
  final String title;

  CalendarPage({Key key, this.title}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _CalendarPageState();
}

class _CalendarPageState extends State<CalendarPage> {
  int _left = -1;
  int _right = -1;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: GridView.count(
        crossAxisCount: 7,
        children: List.generate(31, (index) {
          return Container(
              decoration: BoxDecoration(
                border: Border.all(width: 2.0, color: Colors.black38),
                color: _isInBounds(index)
                    ? Colors.yellow[100]
                    : Colors.transparent,
                borderRadius: const BorderRadius.all(const Radius.circular(8.0)),
              ),
              margin: const EdgeInsets.all(2.0),
              child: FlatButton(
                onPressed: () => _handleTap(index),
                child: Text('${index + 1}',
                    style: Theme.of(context).textTheme.body2,
                    textAlign: TextAlign.center)));
        }),
       ));
  }

  void _handleTap(index) {
    setState(() {
      if (_left == -1)
        _left = index;
      else if (_right == -1) _right = index;
    });
  }

  bool _isInBounds(int index) => _left <= index && index <= _right;
}
0 голосов
/ 25 сентября 2018

UI: https://flutter.io/tutorials/layout/

Выбор диапазона: https://www.didierboelens.com/2018/07/range-slider/

Из этого вы многому научитесь.Удачи!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...