GSTextarea

The GSTextarea widget is designed to accommodate larger amounts of text input. It allows multi-line input and can be easily customized to fit the user's needs.

API Reference

This is an illustration of a Themed GSTextarea widget with default configuration.


    import 'package:gluestack_ui/gluestack_ui.dart';

    GSTextArea(
      size: GSTextAreaSizes.$md,
      hintText: "Enter text here",
      isDisabled: false,
      isInvalid: false,
      readOnly: false,
    )

API Reference

Import

To use this component in your project, include the following import statement in your file.

import "package:gluestack_ui/gluestack_ui.dart"

This section provides a comprehensive reference list for the widget parameters, detailing descriptions, properties, types, and default behavior for easy project integration.

GSTextarea

It inherits all the properties of Flutter's TextFormField widget.

Parameters	Type	Default	Description
size	'sm' \| 'md' \| 'lg' \| 'xl'	'md'	Changes the size of the Input Text
isInvalid	bool	false	When true, the input displays an error state.
isDisabled	bool	false	When true, the input is disabled and cannot be edited.
isReadOnly	bool	false	If true, the input value cannot be edited.

Parameters

Textarea component is created using TextInput component from react-native. It extends all the props supported by React Native Text Input, utility props and the props mentioned below.

GSTextarea

Name	Value	Default
size	xl \| lg \| md \| sm	md

Note: These properties are exclusively applicable when utilizing the default configuration of gluestack-ui/config. If you are using a custom theme, these properties may not be available.

Examples

The Examples section provides visual representations of the different variants of the widget, allowing you to quickly and easily determine which one best fits your needs. Simply copy the code and integrate it into your project.

FormControl

The GSTextarea widget can be incorporated within the FormControl.


    import 'package:gluestack_ui/gluestack_ui.dart';

    GSVStack(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const GSHeading(text: "Write with me"),
        const SizedBox(
          height: 10,
        ),
        GSTextArea(
          hintText: "Once upon a time...",
          style: GSStyle(
            width: 300,
          ),
        ),
        const SizedBox(
          height: 10,
        ),
        const GSText(text: "Start your story"),
      ],
    )

Edit this page on GitHub

GSTextarea

API Reference

Import

Widget Parameters

GSTextarea

Parameters

GSTextarea

Examples

FormControl