codescript_components 1.1.0-alpha1

A library of Flutter components for Codescript projects.

example/codescript_components_example.dart

import 'package:codescript_components/src/components/cs_rounded_input.dart';
import 'package:flutter/material.dart';

void main() {
  MaterialApp(
    home: Scaffold(
      body: Column(
        children: [
          CustomView(),
        ],
      ),
    ),
  );
}

class CustomView extends StatefulWidget {
  const CustomView({super.key});

  @override
  State<CustomView> createState() => _CustomViewState();
}

class _CustomViewState extends State<CustomView> {
  GlobalKey<FormState> formKey = GlobalKey<FormState>();
  TextEditingController? _controller;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Form(
        key: formKey,
        child: Column(
          children: [
            /// This is one approach to use the CSRoundedInput component
            CSRoundedInput(
              labelText: "Hello World",
              controller: _controller,
              validator: (value) {
                if (value == null || value.isEmpty) {
                  return "This field is required";
                }
                return null;
              },
              enabledBorderColor: Colors.blueAccent[600],
              disabledBorderColor: Colors.grey[400],
              focusBorderColor: Colors.green[600],
            ),

            /// This is another approach to use the CSRoundedInput component, and only has the labelText parameter and the floatingLabelBehavior parameter.
            /// You can create a new class that extends the CSRoundedInput class and set the default values for the properties and expose only the properties you want to change.
            CustomInput(labelText: "Hello World"),
          ],
        ),
      ),
    );
  }
}

/// This is another approach to use the CSRoundedInput component
class CustomInput extends CSRoundedInput {
  const CustomInput({required super.labelText, super.floatingLabelBehavior})
      : super(
          enabledBorderColor: Colors.blue,
          disabledBorderColor: Colors.grey,
          focusBorderColor: Colors.green,
        );
}