Quantcast
Channel: Sarina DuPont, Product Manager RAD Studio
Viewing all articles
Browse latest Browse all 132

Defining custom user sign-up properties in your BaaS enabled apps

$
0
0

In a recent blog post, I covered how to add user account creation to your BaaS enabled apps. Our BaaS support that we introduced with the release of RAD Studio XE6 allows you to integrate with leading Backend as a Service providers to add functionality and platform services to your mobile applications.

Many applications today include account creation functionality, allowing the app user to sign up for an account by providing their name, email, username, password etc.

In my recent post, I used the following code:

procedure TAccountSignup.btnCreateAcctClick(Sender: TObject);

var

ACreatedObject: TBackendEntityValue;

begin

BackEndUsers1.Users.SignupUser(Username.Text, Password.Text, nil, ACreatedObject);

ShowMessage(’Account created’);

end;

The third parameter was not defined in my previous demo since the only sign-up info I required was a username and password. The third parameter to SignupUser is a TJSONObject with name value pairs.  You can pass a TJSONValue with email, zip code etc..

You can use either Kinvey or Parse as your BaaS provider. The code and steps are the same for both providers. In my sample application, I am first using Parse and then Kinvey as my BaaS provider. You will need to sign up for an account on Parse.com and/or Kinvey.com . In your IDE, go to File->New->Mobile Application, and select a blank form. Add a toolbar with a parented label to add a title to your form. Then drop a number of TEdit controls onto your form and change their ‘Name’ to something easily identifiable, i.e. EditUsername, EditZipCode etc. In the TextPrompt field for each TEdit, instruct the user what you want them to type in. For the EditPassword control, set the ‘Password’ property in the Object Inspector to ‘True’.

You will also need to drop a BaaS provider component onto your form. If you are using Parse, you will need to use TParseProvider and define your ApplicationID, MasterKey and RESTAPI Key. If you are using Kinvey, you will need to put the TKinveyProvider component onto your form and enter your AppKey, AppSecret and MasterSecret. Then drop a TBackendUsers component onto your form and connect it to your provider of choice.

The Sign Up button has the following on-click event defined:

procedure TSignUpForm.BtnSignUpClick(Sender: TObject);

var

LJSON: TJSONObject;

LLogin: TBackendEntityValue;

begin

LJSON := TJSONObject.Create;

try

LJSON.AddPair(’email’, EditEmail.Text);

LJSON.AddPair(’first_name’, EditFirstName.Text);

LJSON.AddPair(’last_name’, EditLastName.Text);

LJSON.AddPair(’age’, EditAge.Text);

BackendUsers1.Users.SignUpUser(EditUserName.Text, EditPassword.Text, LJSON, LLogin );

ShowMessage(’You are now signed up’);

finally

LJSON.Free;

end;

end;

After this, you should see email, first_name, last_name and age as column headers in your Users section inside your BaaS console. For Kinvey, you can access users via AddOns > Core > Users and for Parse, user management is located under Data Browser > User.  This is in addition to defining a username and password.

You can put whatever you want in the JSON object. For example, I could put another Edit control onto my form, change its name to EditCountry and add LJSON.AddPair(’country’, EditCountry.Text); to my code. This would allow the user of my application to also enter the name of the country they reside in and would result in another column being added in my BaaS console with ‘country’ as its column header title.

You can use BackendUsers.Users.FindUser to retrieve the JSON object and BackendUsers.Users.UpdateUser to change the values in the JSON object.

Here is my app running on Windows with the Windows Preview style:

Here is what I see inside my Parse account after signing up via my sample application:

Here is what I see inside your Kinvey Account:

UI Tip: Some of the input controls will likely be covered by the keyboard once the user clicks on a field, especially on a phone form factor. In that case, you should automatically shift the form up to show the user what field they are typing in. We have a great demo here that shows you how to auto-scroll the form and implement this functionality.

If you don’t own XE6 yet, download a free 30-day trial to try out our powerful BaaS integration.


Viewing all articles
Browse latest Browse all 132

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>