url_textformfield

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A specialized Flutter TextFormField for URL input, offering built-in validation and the ability to append custom text before and after the user's input. It enhances usability by automatically adding common URL prefixes like 'https://' or trailing slashes, reducing user error. Ideal for forms requiring structured web addresses, it supports multiple platforms including mobile, web, and desktop. The package simplifies URL formatting while maintaining flexibility through customizable leading and trailing content.

Use cases

Web address input in forms
Auto-formatting URLs with HTTPS prefix
Adding trailing slashes to incomplete URLs
Custom URL schema enforcement
Multi-platform URL entry
Reducing manual typing errors

Key features

Automatic URL prefix addition
Support for leading and trailing text
Built-in URL validation
Cross-platform compatibility
Configurable input formatting
Simple integration with existing forms

Suitable for

Developers building forms with URL inputs
Apps requiring consistent URL formatting
Projects targeting Android, iOS, Web, macOS, Windows, and Linux
Teams prioritizing user experience in data entry
Frontend developers seeking minimal boilerplate

Considerations

May require additional validation for edge cases
Limited to URL-specific formatting
Depends on correct configuration of prefix/trailing text
Not suitable for non-URL text input
Assumes standard URL structure
Does not handle complex URL parsing beyond basic format

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Textformfield designed for inputing urls, with options to add leading and trailing text, appended at begining and end of input

Getting Started

Add this to your package's pubspec.yaml file


dependencies:
  url_textformfield: ^1.0.0

Usage

First, you just have to import the package using:

import 'package:url_textformfield/url_textformfield.dart';

Then , use the widget as below,


  @override
  Widget build(BuildContext context) {
    return UrlTextFormField(
      focusNode: ctrlFocusNode,  
      padding: const EdgeInsets.all(10),
      onChanged: (val) {},
      leadingText: 'https://',
      suffixIcon: const Icon(
        Icons.check,
        color: Colors.green,
      ),
      trailingText: ".com",
    );

Example

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Search packages, repositories and app categories