Flutter Fix
No Result
View All Result
  • Login
  • Register
  • Media
    • Music
    • Video
    • Images
    • Gallery
  • Flutter Apps
    • Finance App
    • Weather App
    • Video App
    • Music App
    • Shopping App
    • World Clock
    • ECommerce
    • Mobile Web Browser
  • Menu
    • Buttons
    • App Bar
    • Floating Action Button
    • Toast
    • Tab Bar
    • Swipe
  • Components
    • Developers Point
    • Animations
    • Loading
    • Flutter Packages
    • WebView
  • Inputs
    • Forms
    • TextField
    • Toggle Button
    • Download
    • Widgets
  • Games
  • UI
    • Material Design
    • Card
    • Flutter Widgets
    • Neomorphism
    • Navigation
  • Navigation
  • Q&A
  • Dart
    • Flutter Methods
FORUM
ASK QUESTION
  • Media
    • Music
    • Video
    • Images
    • Gallery
  • Flutter Apps
    • Finance App
    • Weather App
    • Video App
    • Music App
    • Shopping App
    • World Clock
    • ECommerce
    • Mobile Web Browser
  • Menu
    • Buttons
    • App Bar
    • Floating Action Button
    • Toast
    • Tab Bar
    • Swipe
  • Components
    • Developers Point
    • Animations
    • Loading
    • Flutter Packages
    • WebView
  • Inputs
    • Forms
    • TextField
    • Toggle Button
    • Download
    • Widgets
  • Games
  • UI
    • Material Design
    • Card
    • Flutter Widgets
    • Neomorphism
    • Navigation
  • Navigation
  • Q&A
  • Dart
    • Flutter Methods
No Result
View All Result
Flutter Fix
No Result
View All Result
Home Flutter Packages

Flutter Native Text Input for iOS Apps – UITextView

August 7, 2020
in Flutter Packages, Inputs, TextField
3 min read
Flutter Native Text Input for iOS Apps – UITextView

This is a plugin or iOS Application Development in Flutter using the UITextView format.

RELATED FLUTTER RESOURCES

Flutter Beautiful Sidebar/Navigation Bar that Collapses when clicked

A Beautiful Bottom navigation bar with bubble click effect in Flutter

A Verification Code Input Widget to get Value in Flutter.

Native Text Input for Flutter 

A text input widget built with the use of UITextView for supporting native text view features. This package supports iOS only for now.

ADVERTISEMENT

Why using this? 

Autocorrect tooltips don’t appear on iOS (https://github.com/flutter/flutter/issues/12920)

Many iOS users have established a habit for using convenience features of native UITextView. No doubt that Flutter provides a lot of useful widgets. However, most Flutter developers should notice that TextField or CupertinoTextField provided by Flutter are not using native UI components and hence text input experience becomes different.

Regarding this, this package aims to simply provide the interface to other developers to use native UITextView directly in your Flutter app.

The above is just showing one of the missing features comparing Flutter TextField from native UITextView, there are some others your app users may find text inputs in your Flutter apps are different from other apps. Those features would be important if you are developing apps that involve composing a text message, messaging app for example.

Hope you find it useful! Enjoy your coding…

Example

import 'dart:io';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_native_text_input/flutter_native_text_input.dart';
import 'package:flutter_native_text_input_example/demo_item.dart';
import 'package:flutter_native_text_input_example/more_page.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: HomePage());
  }
}

class HomePage extends StatelessWidget {
  final FocusNode _focusNode = FocusNode();

  _onChangeText(value) => debugPrint("inputValueChanged: $value");
  _onSubmittedText(value) => debugPrint("onSubmitted: $value");

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Demo Page'),
      ),
      body: ListView(
        children: <Widget>[
          DemoItem(
            title: 'Flutter TextField Example Usage',
            child: TextField(
              onChanged: _onChangeText,
              onSubmitted: _onSubmittedText,
              autocorrect: true,
              decoration: InputDecoration(
                hintText: 'placeholder',
                border: InputBorder.none,
              ),
            ),
          ),
          DemoItem(
            title: 'Flutter CupertinoTextField Example Usage',
            child: CupertinoTextField(
              placeholder: 'placeholder',
              onChanged: _onChangeText,
              onSubmitted: _onSubmittedText,
            ),
          ),
          DemoItem(
            title: 'NativeTextInput Example Usage',
            child: Platform.isIOS
                ? NativeTextInput(
                    placeholder: "placeholder",
                    textContentType: TextContentType.password,
                    keyboardType: KeyboardType.defaultType,
                    onChanged: _onChangeText,
                    onSubmitted: _onSubmittedText,
                    focusNode: _focusNode)
                : TextField(
                    onChanged: _onChangeText,
                    onSubmitted: _onSubmittedText,
                    decoration: InputDecoration(
                      hintText: 'placeholder',
                      border: InputBorder.none,
                    ),
                  ),
          ),
          Center(
            child: FlatButton(
                color: Colors.blue,
                colorBrightness: Brightness.dark,
                child: Text("View More Use Cases"),
                onPressed: () {
                  Navigator.of(context)
                      .push(MaterialPageRoute(builder: (_) => MorePage()));
                }),
          ),
        ],
      ),
    );
  }
}

GitHub

Native text input from iOS for Flutter
https://github.com/henryleunghk/flutter-native-text-input
10 forks.
13 stars.
1 open issues.
Recent commits:

  • fix Chinese typing issue, henryleunghk
  • fix input height not returning default on clearing multi-line text, henryleunghk
  • Improve copywriting on readme page (#2), GitHub
  • update version to 0.1.1, henryleunghk
  • update more use case listing page, henryleunghk

RelatedFlutter Resource

Navigation

Flutter Beautiful Sidebar/Navigation Bar that Collapses when clicked

September 15, 2020
A Beautiful Bottom navigation bar with bubble click effect in Flutter
Navigation

A Beautiful Bottom navigation bar with bubble click effect in Flutter

September 15, 2020
A Verification Code Input Widget to get Value in Flutter.
Flutter Packages

A Verification Code Input Widget to get Value in Flutter.

September 7, 2020
How to select & Pick a Countries from a List in Flutter
Flutter Packages

How to select & Pick a Countries from a List in Flutter

September 2, 2020
How To Record Audio Mp3 using Native API in Flutter
Flutter Packages

How To Record Audio Mp3 using Native API in Flutter

September 2, 2020
How To Display Flag on Your Flutter App Using the Flag Package
Flutter Packages

How To Display Flag on Your Flutter App Using the Flag Package

August 19, 2020
Next Post
Diamond Shaped Floating Action Button in Flutter

Diamond Shaped Floating Action Button in Flutter

Create a Beautiful & Customized Tab/Toggle in Flutter

Create a Beautiful & Customized Tab/Toggle in Flutter

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Recommended Stories

A Contextual Action/App Bar Implementation for Flutter

A Contextual Action/App Bar Implementation for Flutter

August 19, 2020
Different Ways to apply Gradient Colors In Flutter + App Bar

Different Ways to apply Gradient Colors In Flutter + App Bar

June 27, 2020
A BMI Calculator app developed with Flutter + Source Code

A BMI Calculator app developed with Flutter + Source Code

September 7, 2020

Popular Stories

  • FLUTTER-FUTUER-APP-DEVELOPMENT

    Why Google Flutter Is the Future of Mobile App Development

    0 shares
    Share 0 Tweet 0
  • Container Widget & Box Model in Flutter – All You Need To Know

    0 shares
    Share 0 Tweet 0
  • Flutter Future, Await, and Async – All You Need To Know

    0 shares
    Share 0 Tweet 0
  • Create a Beautiful & Customized Tab/Toggle in Flutter

    0 shares
    Share 0 Tweet 0
  • How to use the Flutter Text Field and Input Widget

    0 shares
    Share 0 Tweet 0
  • HOME
  • ABOUT US
  • CONTACT US
  • DMCA
  • TERMS & CONDITIONS
  • PRIVACY POLICY
Call us: +234 705 505 5426

© 2020 FlutterFix - Best Flutter Tool, Library, Source Code, Forum and Tutorials FlutterFix.

No Result
View All Result
  • Media
    • Music
    • Video
    • Images
    • Gallery
  • Flutter Apps
    • Finance App
    • Weather App
    • Video App
    • Music App
    • Shopping App
    • World Clock
    • ECommerce
    • Mobile Web Browser
  • Menu
    • Buttons
    • App Bar
    • Floating Action Button
    • Toast
    • Tab Bar
    • Swipe
  • Components
    • Developers Point
    • Animations
    • Loading
    • Flutter Packages
    • WebView
  • Inputs
    • Forms
    • TextField
    • Toggle Button
    • Download
    • Widgets
  • Games
  • UI
    • Material Design
    • Card
    • Flutter Widgets
    • Neomorphism
    • Navigation
  • Navigation
  • Q&A
  • Dart
    • Flutter Methods

© 2020 FlutterFix - Best Flutter Tool, Library, Source Code, Forum and Tutorials FlutterFix.

Welcome Back!

Login to your account below

Forgotten Password? Sign Up

Create New Account!

Fill the forms bellow to register

All fields are required. Log In

Retrieve your password

Please enter your username or email address to reset your password.

Log In