App7 : Short Vacation - Learning New Widgets

1. OutlinedButton

A Material Design "Outlined Button"; essentially a TextButton with an outlined border.

Outlined buttons are medium-emphasis buttons. They contain actions that are important, but they aren’t the primary action in an app.

Some properties of CupertinoButton Class:

1. child : Widget

Typically the button's label.

2. onPressed :

Called when the button is tapped or otherwise activated.

3. style : ButtonStyle?

Customizes this button's appearance.

Example :




        OutlinedButton(

          child: Text("Click Me"),

          onPressed: () {

            print("clicked");

          },

          style: TextButton.styleFrom(backgroundColor: Colors.white38),

        ),







2. CupertinoDatePicker

A date picker widget in iOS style.

There are several modes of the date picker listed in CupertinoDatePickerMode.

The class will display its children as consecutive columns. Its children order is based on internationalization, or the dateOrder property if specified.

Some properties of CupertinoDatePicker Class:

1. backgroundColor : Color?

Background color of date picker.

2. initialDateTime : DateTime

The initial date and/or time of the picker. Defaults to the present date and time and must not be null. The present must conform to the intervals set in minimumDate, maximumDate, minimumYear, and maximumYear.

3. maximumDate : DateTime?

The maximum selectable date that the picker can settle on.

4. minimumDate : DateTime?

The minimum selectable date that the picker can settle on.

5. mode : CupertinoDatePickerMode

The mode of the date picker as one of CupertinoDatePickerMode. Defaults to CupertinoDatePickerMode.dateAndTime. Cannot be null and value cannot change after initial build.

6. onDateTimeChanged : Widget?

Callback called when the selected date and/or time changes. If the new selected DateTime is not valid, or is not in the minimumDate through maximumDate range, this callback will not be called.

Example :




 DateTime date =DateTime.now();

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      body: Center(

        child: CupertinoDatePicker(

          backgroundColor: Colors.lime,

          initialDateTime: DateTime.now(),

          maximumDate: DateTime.now().add(Duration(days: 365)),

          minimumDate: DateTime.now().subtract(Duration(days: 30)),

          mode: CupertinoDatePickerMode.date,

          onDateTimeChanged: (newDate){

            date=newDate;

          }

          ,

        )

      ),

    );

  }