adding multi-language support and custom layout

This commit is contained in:
Ahmed El-Araby 2020-03-19 11:50:42 +03:00
parent 30c17d35ae
commit 143cc5120f
16 changed files with 289 additions and 170 deletions

View File

@ -2,7 +2,7 @@
```dart
import 'package:flutter/material.dart';
import 'package:virtual_keyboard/virtual_keyboard.dart';
import 'package:virtual_keyboard_multi_language/virtual_keyboard_multi_language.dart';
void main() => runApp(MyApp());

View File

@ -1 +1,2 @@
org.gradle.jvmargs=-Xmx1536M
android.enableR8=true

View File

@ -0,0 +1,10 @@
#!/bin/sh
# This is a generated file; do not edit or check into version control.
export "FLUTTER_ROOT=C:\src\flutter"
export "FLUTTER_APPLICATION_PATH=D:\_Workspace\virtual_keyboard_multi_language\example"
export "FLUTTER_TARGET=lib\main.dart"
export "FLUTTER_BUILD_DIR=build"
export "SYMROOT=${SOURCE_ROOT}/../build\ios"
export "FLUTTER_FRAMEWORK_DIR=C:\src\flutter\bin\cache\artifacts\engine\ios"
export "FLUTTER_BUILD_NAME=1.0.0"
export "FLUTTER_BUILD_NUMBER=1"

View File

@ -0,0 +1,87 @@
import 'package:virtual_keyboard_multi_language/virtual_keyboard_multi_language.dart';
class CustomLayoutKeys extends VirtualKeyboardLayoutKeys{
@override
int getLanguagesCount() => 2;
List<List> getLanguage(int index){
switch(index){
case 1:
return _arabicLayout;
default:
return defaultEnglishLayout;
}
}
}
const List<List> _arabicLayout = [
// Row 1
const [
'1',
'2',
'3',
'4',
'5',
'6',
'7',
'8',
'9',
'0',
],
// Row 2
const [
'ض',
'ص',
'ث',
'ق',
'ف',
'غ',
'ع',
'ه',
'خ',
'ح',
'د',
VirtualKeyboardKeyAction.Backspace
],
// Row 3
const [
'ش',
'س',
'ي',
'ب',
'ل',
'ا',
'ت',
'ن',
'م',
'ك',
'ط',
VirtualKeyboardKeyAction.Return
],
// Row 4
const [
'ذ',
'ئ',
'ء',
'ؤ',
'ر',
'لا',
'ى',
'ة',
'و',
'.',
'ظ',
VirtualKeyboardKeyAction.Shift
],
// Row 5
const [
VirtualKeyboardKeyAction.SwithLanguage,
'@',
VirtualKeyboardKeyAction.Space,
'-',
'_',
]
];

View File

@ -1,5 +1,6 @@
import 'package:flutter/material.dart';
import 'package:virtual_keyboard/virtual_keyboard.dart';
import 'package:virtual_keyboard_multi_language/virtual_keyboard_multi_language.dart';
import 'package:example/custom_layout.dart';
void main() => runApp(MyApp());
@ -27,13 +28,19 @@ class MyHomePage extends StatefulWidget {
class _MyHomePageState extends State<MyHomePage> {
// Holds the text that user typed.
String text = '';
CustomLayoutKeys _customLayoutKeys;
// True if shift enabled.
bool shiftEnabled = false;
// is true will show the numeric keyboard.
bool isNumericMode = true;
@override
void initState() {
_customLayoutKeys = CustomLayoutKeys();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
@ -68,7 +75,9 @@ class _MyHomePageState extends State<MyHomePage> {
color: Colors.deepPurple,
child: VirtualKeyboard(
height: 300,
width: 700,
textColor: Colors.white,
layoutKeys: _customLayoutKeys,
type: isNumericMode
? VirtualKeyboardType.Numeric
: VirtualKeyboardType.Alphanumeric,

View File

@ -20,7 +20,7 @@ dependencies:
flutter:
sdk: flutter
virtual_keyboard:
virtual_keyboard_multi_language:
path: ../
# The following adds the Cupertino Icons font to your application.

View File

@ -1,12 +1,20 @@
part of virtual_keyboard;
part of virtual_keyboard_multi_language;
/// Virtual Keyboard key
class VirtualKeyboardKey {
final String text;
final String capsText;
String text;
String capsText;
final VirtualKeyboardKeyType keyType;
final VirtualKeyboardKeyAction action;
VirtualKeyboardKey(
{this.text, this.capsText, @required this.keyType, this.action});
{this.text, this.capsText, @required this.keyType, this.action}){
if(this.text == null && this.action != null){
this.text = action == VirtualKeyboardKeyAction.Space ? ' ' : (action == VirtualKeyboardKeyAction.Return ? '\n' : '');
}
if(this.capsText == null && this.action != null){
this.capsText = action == VirtualKeyboardKeyAction.Space ? ' ' : (action == VirtualKeyboardKeyAction.Return ? '\n' : '');
}
}
}

View File

@ -1,4 +1,4 @@
part of virtual_keyboard;
part of virtual_keyboard_multi_language;
/// Virtual keyboard actions.
enum VirtualKeyboardKeyAction { Backspace, Return, Shift, Space }
enum VirtualKeyboardKeyAction { Backspace, Return, Shift, Space, SwithLanguage }

View File

@ -1,4 +1,4 @@
part of virtual_keyboard;
part of virtual_keyboard_multi_language;
/// Type for virtual keyboard key.
///

View File

@ -1,4 +1,4 @@
part of virtual_keyboard;
part of virtual_keyboard_multi_language;
/// The default keyboard height. Can we overriden by passing
/// `height` argument to `VirtualKeyboard` widget.
@ -17,11 +17,16 @@ class VirtualKeyboard extends StatefulWidget {
/// Virtual keyboard height. Default is 300
final double height;
/// Virtual keyboard height. Default is screen width
final double width;
/// Color for key texts and icons.
final Color textColor;
/// Font size for keyboard keys.
final double fontSize;
final VirtualKeyboardLayoutKeys layoutKeys;
/// The builder function will be called for each Key object.
final Widget Function(BuildContext context, VirtualKeyboardKey key) builder;
@ -34,6 +39,8 @@ class VirtualKeyboard extends StatefulWidget {
@required this.type,
@required this.onKeyPress,
this.builder,
this.width,
this.layoutKeys,
this.height = _virtualKeyboardDefaultHeight,
this.textColor = Colors.black,
this.fontSize = 14,
@ -53,9 +60,11 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
// The builder function will be called for each Key object.
Widget Function(BuildContext context, VirtualKeyboardKey key) builder;
double height;
double width;
Color textColor;
double fontSize;
bool alwaysCaps;
VirtualKeyboardLayoutKeys layoutKeys;
// Text Style for keys.
TextStyle textStyle;
@ -69,10 +78,11 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
type = widget.type;
onKeyPress = widget.onKeyPress;
height = widget.height;
width = widget.width;
textColor = widget.textColor;
fontSize = widget.fontSize;
alwaysCaps = widget.alwaysCaps;
layoutKeys = widget.layoutKeys ?? VirtualKeyboardLayoutKeys();
// Init the Text Style for keys.
textStyle = TextStyle(
fontSize: fontSize,
@ -85,7 +95,9 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
void initState() {
super.initState();
width = widget.width;
type = widget.type;
layoutKeys = widget.layoutKeys ?? VirtualKeyboardLayoutKeys();
onKeyPress = widget.onKeyPress;
height = widget.height;
textColor = widget.textColor;
@ -107,7 +119,7 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
Widget _alphanumeric() {
return Container(
height: height,
width: MediaQuery.of(context).size.width,
width: width ?? MediaQuery.of(context).size.width,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
@ -119,7 +131,7 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
Widget _numeric() {
return Container(
height: height,
width: MediaQuery.of(context).size.width,
width: width ?? MediaQuery.of(context).size.width,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
@ -134,7 +146,7 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
List<List<VirtualKeyboardKey>> keyboardRows =
type == VirtualKeyboardType.Numeric
? _getKeyboardRowsNumeric()
: _getKeyboardRows();
: _getKeyboardRows(layoutKeys);
// Generate keyboard row.
List<Widget> rows = List.generate(keyboardRows.length, (int rowNum) {
@ -198,7 +210,7 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
onKeyPress(key);
},
child: Container(
height: height / _keyRows.length,
height: height / layoutKeys.activeLayout.length,
child: Center(
child: Text(
alwaysCaps
@ -258,10 +270,26 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
color: textColor,
);
break;
case VirtualKeyboardKeyAction.SwithLanguage:
actionKey = GestureDetector(
onTap: () {
setState(() {
layoutKeys.switchLanguage();
});
},
child: Container(
height: double.infinity,
width: double.infinity,
child: Icon(
Icons.language,
color: textColor,
),
));
break;
break;
}
return Expanded(
child: InkWell(
var wdgt =InkWell(
onTap: () {
if (key.action == VirtualKeyboardKeyAction.Shift) {
if (!alwaysCaps) {
@ -275,10 +303,15 @@ class _VirtualKeyboardState extends State<VirtualKeyboard> {
},
child: Container(
alignment: Alignment.center,
height: height / _keyRows.length,
height: height / layoutKeys.activeLayout.length,
child: actionKey,
),
),
);
);
if(key.action == VirtualKeyboardKeyAction.Space)
return SizedBox(width: (width ?? MediaQuery.of(context).size.width)/2, child:wdgt);
else
return Expanded(child:wdgt);
}
}

93
lib/src/layout_keys.dart Normal file
View File

@ -0,0 +1,93 @@
part of virtual_keyboard_multi_language;
//import '../virtual_keyboard_multi_language.dart';
class VirtualKeyboardLayoutKeys{
int getLanguagesCount() => 1;
int activeIndex =0;
List<List> getLanguage(int index){
return _defaultEnglishLayout;
}
void switchLanguage(){
if((activeIndex+1) == getLanguagesCount())
activeIndex =0;
else activeIndex++;
}
List<List> get defaultEnglishLayout => _defaultEnglishLayout;
List<List> get activeLayout => getLanguage(activeIndex);
}
/// Keys for Virtual Keyboard's rows.
const List<List> _defaultEnglishLayout = [
// Row 1
const [
'1',
'2',
'3',
'4',
'5',
'6',
'7',
'8',
'9',
'0',
],
// Row 2
const [
'q',
'w',
'e',
'r',
't',
'y',
'u',
'i',
'o',
'p',
VirtualKeyboardKeyAction.Backspace
],
// Row 3
const [
'a',
's',
'd',
'f',
'g',
'h',
'j',
'k',
'l',
';',
'\'',
VirtualKeyboardKeyAction.Return
],
// Row 4
const [
VirtualKeyboardKeyAction.Shift,
'z',
'x',
'c',
'v',
'b',
'n',
'm',
',',
'.',
'/',
VirtualKeyboardKeyAction.Shift
],
// Row 5
const [
VirtualKeyboardKeyAction.SwithLanguage,
'@',
VirtualKeyboardKeyAction.Space,
'&',
'_',
]
];

View File

@ -1,66 +1,4 @@
part of virtual_keyboard;
/// Keys for Virtual Keyboard's rows.
const List<List> _keyRows = [
// Row 1
const [
'1',
'2',
'3',
'4',
'5',
'6',
'7',
'8',
'9',
'0',
],
// Row 2
const [
'q',
'w',
'e',
'r',
't',
'y',
'u',
'i',
'o',
'p',
],
// Row 3
const [
'a',
's',
'd',
'f',
'g',
'h',
'j',
'k',
'l',
';',
'\'',
],
// Row 4
const [
'z',
'x',
'c',
'v',
'b',
'n',
'm',
',',
'.',
'/',
],
// Row 5
const [
'@',
'_',
]
];
part of virtual_keyboard_multi_language;
/// Keys for Virtual Keyboard's rows.
const List<List> _keyRowsNumeric = [
@ -106,93 +44,32 @@ List<VirtualKeyboardKey> _getKeyboardRowKeysNumeric(rowNum) {
}
/// Returns a list of `VirtualKeyboardKey` objects.
List<VirtualKeyboardKey> _getKeyboardRowKeys(rowNum) {
List<VirtualKeyboardKey> _getKeyboardRowKeys(VirtualKeyboardLayoutKeys layoutKeys,rowNum) {
// Generate VirtualKeyboardKey objects for each row.
return List.generate(_keyRows[rowNum].length, (int keyNum) {
return List.generate(layoutKeys.activeLayout[rowNum].length, (int keyNum) {
// Get key string value.
String key = _keyRows[rowNum][keyNum];
if(layoutKeys.activeLayout[rowNum][keyNum] is String){
String key = layoutKeys.activeLayout[rowNum][keyNum];
// Create and return new VirtualKeyboardKey object.
return VirtualKeyboardKey(
text: key,
capsText: key.toUpperCase(),
keyType: VirtualKeyboardKeyType.String,
);
// Create and return new VirtualKeyboardKey object.
return VirtualKeyboardKey(
text: key,
capsText: key.toUpperCase(),
keyType: VirtualKeyboardKeyType.String,
);
}else{
var action = layoutKeys.activeLayout[rowNum][keyNum] as VirtualKeyboardKeyAction;
return VirtualKeyboardKey(
keyType: VirtualKeyboardKeyType.Action,
action: action);
}
});
}
/// Returns a list of VirtualKeyboard rows with `VirtualKeyboardKey` objects.
List<List<VirtualKeyboardKey>> _getKeyboardRows() {
List<List<VirtualKeyboardKey>> _getKeyboardRows(VirtualKeyboardLayoutKeys layoutKeys) {
// Generate lists for each keyboard row.
return List.generate(_keyRows.length, (int rowNum) {
// Will contain the keyboard row keys.
List<VirtualKeyboardKey> rowKeys = [];
// We have to add Action keys to keyboard.
switch (rowNum) {
case 1:
// String keys.
rowKeys = _getKeyboardRowKeys(rowNum);
// 'Backspace' button.
rowKeys.add(
VirtualKeyboardKey(
keyType: VirtualKeyboardKeyType.Action,
action: VirtualKeyboardKeyAction.Backspace),
);
break;
case 2:
// String keys.
rowKeys = _getKeyboardRowKeys(rowNum);
// 'Return' button.
rowKeys.add(
VirtualKeyboardKey(
keyType: VirtualKeyboardKeyType.Action,
action: VirtualKeyboardKeyAction.Return,
text: '\n',
capsText: '\n'),
);
break;
case 3:
// Left Shift
rowKeys.add(
VirtualKeyboardKey(
keyType: VirtualKeyboardKeyType.Action,
action: VirtualKeyboardKeyAction.Shift),
);
// String keys.
rowKeys.addAll(_getKeyboardRowKeys(rowNum));
// Right Shift
rowKeys.add(
VirtualKeyboardKey(
keyType: VirtualKeyboardKeyType.Action,
action: VirtualKeyboardKeyAction.Shift),
);
break;
case 4:
// String keys.
rowKeys = _getKeyboardRowKeys(rowNum);
// Insert the space key into second position of row.
rowKeys.insert(
1,
VirtualKeyboardKey(
keyType: VirtualKeyboardKeyType.Action,
text: ' ',
capsText: ' ',
action: VirtualKeyboardKeyAction.Space),
);
break;
default:
rowKeys = _getKeyboardRowKeys(rowNum);
}
return rowKeys;
});
return List.generate(layoutKeys.activeLayout.length, (int rowNum) => _getKeyboardRowKeys(layoutKeys,rowNum));
}
/// Returns a list of VirtualKeyboard rows with `VirtualKeyboardKey` objects.

View File

@ -1,4 +1,4 @@
part of virtual_keyboard;
part of virtual_keyboard_multi_language;
/// Available Virtual Keyboard Types:
/// `Numeric` - Numeric only.

View File

@ -1,4 +1,4 @@
library virtual_keyboard;
library virtual_keyboard_multi_language;
import 'dart:async';
import 'package:flutter/material.dart';
@ -9,3 +9,4 @@ part './src/key.dart';
part './src/keyboard.dart';
part './src/rows.dart';
part './src/type.dart';
part './src/layout_keys.dart';

View File

@ -1,8 +1,8 @@
name: virtual_keyboard
name: virtual_keyboard_multi_language
description: A simple package for dispaying virtual keyboards on a devices like kiosks and ATMs. The library is written in Dart and has no native code dependancy.
version: 0.1.4
author: Gurgen Hovhannisyan <g.hovhannisyan@digitalpomegranate.com>
homepage: https://github.com/gurgenDP/virtual_keyboard
author: Ahmed El-Araby <ahmed-eg@live.com>
homepage: https://github.com/ahmed-eg/virtual_keyboard_multi_language
environment:
sdk: ">=2.1.0 <3.0.0"

View File

@ -1,6 +1,6 @@
import 'package:flutter_test/flutter_test.dart';
import 'package:virtual_keyboard/virtual_keyboard.dart';
import 'package:virtual_keyboard_multi_language/virtual_keyboard_multi_language.dart';
void main() {
test('creates keyboard widget with Alphanumeric type', () {