Interactive Ink

Answered

Android How to create a form with multiple text field such as mobile number, postal code & name on single editor view

I am able to create multiple configuration, although I am unable to configure my Text Document having specific configuration for each Content Block.


What should be the way forward to achieve it.


Best Answer
Hi Irshad,

Currently, it is not possible to configure the blocks of a Text Document to each have different configurations.
To achieve what you are trying to do, you can either combine multiple editors inside your UI (if you have just a few fields) or you can have a pool of editors that you can properly configure and use depending on which "field" of your form is active.
With the latter approach, you may want to modify the UI Reference Implementation to have a shared InputController and dispatch the input to the right editor. You can also have your renderers all share the same render target (a single Android view), provided that each editor is configured with the appropriate margins when used for a particular field (so that the content is rendered at the right location in your view).

Best regards,
Thomas

 


2 people have this question

Thanks for input, currently I have created multiple Editors as well multiple engine (to have different configuration for fields eg: Name, Number or Date).

I was unable to make single Engine works with multiple editor with multiple configuration, since ContentPart only takes parameter as "Text" or "Math" whereas I need to specify type only as Text but part of configuration to be changed.

Can you help me how I can change on runtime between mutiple configuration for engine for the same Type (i.e "Text").

 

Bundle-Version: 1.0
Bundle-Name: en_US
Configuration-Script:
 AddResDir ../res_lang/

Name: name
Type: Text
Configuration-Script:
 AddResource en_US-ak-cur.res
 AddResource en_US-lk-text.res
 AddResource name_subset.res
 AddResource indian_name.res
 SetTextListSize 1
 SetWordListSize 3
 SetCharListSize 1

Name: number
Type: Text
Configuration-Script:
 AddResource en_US-ak-cur.res
 AddResource en_US-lk-text.res
 AddResource number_only.res
 SetTextListSize 1
 SetWordListSize 1
 SetCharListSize 1

 



1 person likes this

Hi Mael,

Thanks for Responding.

May I know when can I get the form code sample.

Regards,

Swapnil


1 person likes this

Hi Irshad,

As of today, configuration is only available at engine level. However, you can take benefit from the fact that "text.configuration.*" settings are taken into account when you call editor.setPart() to achieve what you want to do, rather than having multiple engines.

The following sequence should allow having a single engine and several editors with various configurations:

engine.getConfiguration().setString("text.configuration.name", "text");
editor1.setPart(part_text);
engine.getConfiguration().setString("text.configuration.name", "number");
editor2.setPart(part_number);

Best regards,

Thomas


1 person likes this
Answer
Hi Irshad,

Currently, it is not possible to configure the blocks of a Text Document to each have different configurations.
To achieve what you are trying to do, you can either combine multiple editors inside your UI (if you have just a few fields) or you can have a pool of editors that you can properly configure and use depending on which "field" of your form is active.
With the latter approach, you may want to modify the UI Reference Implementation to have a shared InputController and dispatch the input to the right editor. You can also have your renderers all share the same render target (a single Android view), provided that each editor is configured with the appropriate margins when used for a particular field (so that the content is rendered at the right location in your view).

Best regards,
Thomas

 


1 person likes this

Dear Mael,

Has the code sample for this been implemented?

Thanks,

Piyush

I am waiting since long time for sample, they said couple of days but still no update from them. Mael, I am waiting for the sample request you to please provide the same. Thanks, Swapnil

Dear Piyush, Dear Swapnil,


In the attached zip file, please find a patch you should extract over the "iink" directory.


Basically,  it will replace/update files and add few ones in the default getStarted  sample ; this project is designed to be a quick sample, we cannot  recommend it "as is" in a production application:

-When running the "GetStarted" , the main window of the application will display 3 rectangle views

-The top view is to recognize text, it is basically a text part

-The middle view is a math part

-The bottom one is a text part, similarly to the top one

-Each of these 3 views has its own editor

-When  writing a stroke, based on the position of the first point of the  stroke (e.g. in the top view), it will be added to the pointerEvents of  the corresponding editor.

-You can then give a try, writing text in the bottom and top rectangles, and math in the middle one

-The corresponding results will be logged when clicking the "Log result" button


Regarding the files:

-The CustomEditorView.java files extends the previous EditorView.java to support several editors

-The customeditor_view.xml defines a layout based on the CustomEditorView.java

-The  CustomInputController.java extends the previous InputController.java to  work with several editors ; based on the position of the ACTION_DOWN  MotionEvent, it will dispatch the stroke to the proper editor

-In the MainActvity.java:

  • The 3 writing views are created calling the createCustomViews() function line 61
  • We then create a view based on the customeditor_view line 64: "customEditorView = findViewById(R.id.customeditor_view);"
  • Line 65, our custom "setEngine" function is called
  • From lines 67 to 99, each editor is added a IEditorListener
  • Line 111 to 113, parts are created (you are free to set the type part you prefers, eg. 3 "Text" parts)
  • Each editor is then assigned with its part line 138
  • From  line 185 to 222, the "onOptionsItemSelected" function will get the  result of the export and Logs it in the logcat when the "Log result"  button is pressed
  • Last, from line 256 to 304, we define the 3 views in which we write ("createCustomViews" function)

If  playing with this easy sample, you understand how a form sample could  be defined, creating several views, each one with its own editor ; when a  stroke is drawn in a view, it is then added to the pointerEvents of the  editor corresponding to this view.


We insist this is a quick  demo sample, which may not be updated nor maintained in the future,  which may still contain bugs and shall not be used "as is" for a mass  production application ; it is your own responsibility to develop a form  application ; the purpose of this sample is just to explain one way it  may be done.


Best regards,


Olivier

Hi Olivier,

The zip file is not downloadable.

It is readonly.

Thanks,

Piyush

Dear Piyush,


please find it here.


Best regards,


Olivier

1. In a use case of type "form with multiple fields", how to know which "field" of the form is active at runtime, so as to configure the editor from editor pool to that particular "field".

2. What should be the configuration of an editor, configured on a particular "field", so that it only accepts "number" i.e. 24589 or "text" i.e. "swapnil".

Thanks,

Swapnil Gaikwad.

Hi Olivier, 

After installing the patch, I am getting compilation error.

The following class from UIReferenceImplementation is not there.

import com.myscript.iink.uireferenceimplementation.IRenderView;

Thanks,

Piyush



Dear Piyush,


you can just comment the corresponding lines in the CustomEditorView.java file.


@Nullable
private IRenderView renderView;
@Nullable
private IRenderView[] layerViews;


Best regards,


Olivier

Dear Olivier,

I am able to compile, however I am getting a NullPointerException when the application is trying to start. The reason is that editor is coming as null. Do I have to do something else.

image

Regards,

Piyush

Dear Piyush,


just patch the EditorView.java file as follows:

-Go to the onSizeChanged function

-add the red part:

if (editor != null) {
editor.setViewSize(newWidth, newHeight);
  invalidate(renderer, EnumSet.allOf(IRenderTarget.LayerType.class));
}


Best regards,


Olivier


Hi Swapnil,

Were you able to implement this?

Piyush

  • Support
  • Forums
  • Interactive Ink
  • Android How to create a form with multiple text field such as mobile number, postal code & name on single editor view