Divider widget and Attributes

Divider widget and Attributes

ยท

1 min read

The Divider widget in Flutter is a simple horizontal line that is often used to separate content or sections within a user interface. It provides a visual break to improve the overall layout and readability of the interface.

Attributes:

  1. height (double):

    • The height of the divider. The default height is 16.0.
  2. thickness (double):

    • The thickness of the divider, which is the horizontal line. The default thickness is 0.5.
  3. color (Color):

    • The color of the divider. You can specify a specific color using the Color class.

Example:

import 'package:flutter/material.dart';

class DividerExample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Divider Example'),
      ),
      body: Column(
        children: [
          Text('Above the Divider'),
          Divider(),
          Text('Below the Divider'),
        ],
      ),
    );
  }
}

void main() {
  runApp(
    MaterialApp(
      home: DividerExample(),
    ),
  );
}

In this example, a Divider is placed between two Text widgets, creating a visual separation. The default height and thickness are used. You can customize the appearance of the divider by adjusting the height, thickness, and color attributes based on your design preferences. The Divider widget is a simple yet effective way to enhance the structure and organization of your UI.

ย