This is a migrated thread and some comments may be shown as answers.

Aligning and Borders around editors

2 Answers 12 Views
DataForm
This is a migrated thread and some comments may be shown as answers.
Brian
Top achievements
Rank 2
Brian asked on 07 Jan 2019, 02:59 AM

Hey Guys, I've been working with dataforms and I have it close but not quite to the spec I'm trying to achieve.  Attached is a "SignUp" screen and I'm using your "Reservation" renderer on iOS.  There are two things missing from my render that I need help with.  First, I'd like to put a full boarder around each field.  Second, I'd like the fields to align on the left near their icons and span across the white space.   I'm adding my login screen because it has the fields look and feel that I'm trying to match.  If you can point me to the documentation or any additional samples that show this I would greatly appreciate it.

Attached: 

SignUp - Needs help

Login - The look I'm trying to achieve...

Thank you!

Brian

 

 

 

2 Answers, 1 is accepted

Sort by
0
Accepted
Didi
Telerik team
answered on 08 Jan 2019, 04:13 PM
Hello Brian,

Thank you for the provided images.

Let me get straight to your questions:

1) Full boarder around each field:

In order to achieve this scenario you should implement a custom renderer for each platform. I have created a sample project that shows how the custom renderer is implemented on iOS. Basically inside the custom renderer you will need to set the following properties to the editor.Layer: CornderRadius, BorderColor, BorderWidth and ClipsToBounds. For more details please refer to the CustomDataFormRenderer.cs file - InitEditor method from the attached project.

2) Editor Fields Left Alignment:

The left alignment could be achieved through custom renderer. You will need to add the following code inside the overridden InitEditor method: 

editor.Style.TextLabelDisplayMode = TKDataFormEditorTextLabelDisplayMode.Hidden;
 
var textLabelDef = editor.GridLayout.DefinitionForView(editor.TextLabel);
editor.GridLayout.SetWidth(0, textLabelDef.Column.Int32Value);
editor.Style.EditorOffset = new UIOffset(15, 0);


Please take a look at the attached project and let me know if you have any additional questions on this.

Regards,
Didi
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Brian
Top achievements
Rank 2
answered on 09 Jan 2019, 02:10 AM

Thank you very much!  You all are great the way you give us examples to review, love your product and company!

Brian

Tags
DataForm
Asked by
Brian
Top achievements
Rank 2
Answers by
Didi
Telerik team
Brian
Top achievements
Rank 2
Share this question
or