CODEWITHSUNDEEP
flutter
USER9561
USER9561

Reputation: 1084

Horizontal ScrollView for dates

I want to have all the dates of a month in a horizontal ScrollView. I am displaying 7 current week dates and on scroll it should display other week dates. Here is my code. Scroll is not working in this code. I have tried adding singlechild scroll view as well but is not working.

                        //////Days Displayed here///////
                        new Padding(
                          padding: new EdgeInsets.only(
                            top: 10.0, bottom: 5.0
                          ),
                          child: new Container(
                            width: 35.0,
                            height: 35.0,
                            alignment: Alignment.center,
                            decoration: new BoxDecoration(
                              shape: BoxShape.circle,
                              color: today
                                ? const Color.fromRGBO(204, 204, 204, 0.3)
                                : Colors.transparent
                            ),
                            child: new Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                GestureDetector(
                                  onTap: () {
                                    print('OnTapped');
                                  },
                                  child: new Text(
                                    arrayDay[i].toString(),
                                    style: new TextStyle(
                                      fontSize: 12.0,
                                      fontWeight: FontWeight.w400
                                    ),
                                  ),
                                ),
                              ],
                            )
                          ),
                        )

The arrayDay contains all the dates. Please help. How to do this?

Upvotes: 0

Views: 480

Answers (1)

Zvi Karp
Zvi Karp

Reputation: 3904

I would suggest to use the PageView, this is what it is made for, it offers snapping witch make it all a lot easier. Here is a code example:

  Widget _daysOfWeek(int week) {
    return Row(
      children: <Widget>[
        Text("display here days of week " + week.toString()),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: 200,
        height: 200,
        child: PageView(
          children: <Widget>[
            _daysOfWeek(1),
            _daysOfWeek(2),
            _daysOfWeek(3),
            _daysOfWeek(4),
          ],
        ),
      ),
    );
  }

In the function _daysOfWeek you can display the days based on what page we are on.

See working example here: https://dartpad.dartlang.org/ab7cfaa813ad2c84e3c6d8d93b7b87d7

Upvotes: 1

Related Questions