Skip to main content

CwCheckBoxTile Documentation

Overview​

The CwCheckBoxTile is a versatile checkbox widget that provides a flexible layout for creating customizable checkbox-based list tiles. It extends the CwCheckBox class and offers extensive customization options for styling, positioning, and content arrangement.

Parameters Explanation​

Required Parameters​

  • onChange (required): A callback function triggered when the checkbox state changes.
  • isChecked (required): Boolean value representing the current checked state of the checkbox.
  • checkBoxWidget (required): The widget representing the checkbox.
  • checkBoxWidth (required): Width of the checkbox.

Optional Parameters​

  • title: A widget displayed as the primary text/title of the tile.
  • subTitle: A widget displayed as secondary text beneath the title.
  • leadingWidget: A widget positioned before the main content.
  • trailingWidget: A widget positioned after the main content.
  • contentWidget: A custom widget to replace the default title and subtitle layout.
  • checkBoxPosition: Determines the positioning of the checkbox within the tile (default: CheckBoxPosition.trailingCenter).
    • Options include:
      • leadingTop
      • trailingTop
      • leadingCenter
      • trailingCenter
      • leadingBottom
      • trailingBottom

Styling Parameters​

  • checkBoxTileHeight: Height of the checkbox tile.
  • checkBoxTileWidth: Width of the checkbox tile.
  • checkBoxTilepadding: Custom padding for the checkbox tile (defaults to PaddingConst.pad_12).
  • checkBoxTileBackgroundColor: Background color of the checkbox tile.
  • checkBoxTileGradient: Optional gradient background for the checkbox tile.
  • checkBoxTileBorder: Custom border styling for the checkbox tile.
  • checkBoxTileBorderRadius: Border radius to customize the tile's shape.
  • iconSize: Size of the checkbox icon.

Usage Examples​

1. Basic Checkbox Tile with Default Configuration​

A simple checkbox tile with title and subtitle.

CwCheckBoxTile(
  onChange: (isChecked) => print('Checkbox changed: $isChecked'),
  isChecked: false,
  checkBoxWidget: Checkbox(value: false, onChanged: (value) {}),
  checkBoxWidth: 24,
  title: Text('Checkbox Tile Title'),
  subTitle: Text('Checkbox Tile Subtitle'),
)

2. Customized Checkbox Tile with Leading Widget​

A checkbox tile with a leading icon and custom positioning.

CwCheckBoxTile(
  onChange: (isChecked) => print('Checkbox changed: $isChecked'),
  isChecked: true,
  checkBoxWidget: Checkbox(value: true, onChanged: (value) {}),
  checkBoxWidth: 30,
  checkBoxPosition: CheckBoxPosition.leadingTop,
  checkBoxTileBackgroundColor: Colors.grey.shade200,
  leadingWidget: Icon(Icons.person, color: Colors.blue),
  title: Text('Profile Settings'),
  subTitle: Text('Manage your account preferences'),
  trailingWidget: Icon(Icons.arrow_forward_ios),
)

3. Checkbox Tile with Custom Content and Gradient​

A checkbox tile with a custom content widget and gradient background.

CwCheckBoxTile(
  onChange: (isChecked) => print('Checkbox changed: $isChecked'),
  isChecked: false,
  checkBoxWidget: Checkbox(value: false, onChanged: (value) {}),
  checkBoxWidth: 26,
  checkBoxPosition: CheckBoxPosition.trailingCenter,
  checkBoxTileGradient: LinearGradient(
    colors: [Colors.purple.shade100, Colors.purple.shade300],
    begin: Alignment.topLeft,
    end: Alignment.bottomRight,
  ),
  contentWidget: Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Text('Advanced Settings', style: TextStyle(fontWeight: FontWeight.bold)),
      SizedBox(height: 4),
      Text('Customize your advanced preferences'),
    ],
  ),
)

Checkbox Positioning​

The checkBoxPosition parameter allows flexible control over checkbox placement:

  • leadingTop: Checkbox at top-left
  • trailingTop: Checkbox at top-right
  • leadingCenter: Checkbox at center-left
  • trailingCenter: Checkbox at center-right
  • leadingBottom: Checkbox at bottom-left
  • trailingBottom: Checkbox at bottom-right

Source Code Repository​

Find the full source code on GitHub: GitHub Repository