Have an amazing solution built in RAD Studio? Let us know. Looking for discounts? Visit our Special Offers page!
Delphi

Creating a profile screen for your mobile application

 

I am using the following components on my form:

  • TTabControl with 3 tab items
  •    TabItem3 consists of:
    • TCircle with the stroke color set to match the toolbar color and a profile photo as the fill
    • TToolbar with multiple Speedbuttons and the screen title
    • Multiple labels on the form
    • TListBox with several list items, each with a custom bitmap and a Listbox search header.
    • TStyleBook with a custom iOS style
    • TImage aligned to the client with a custom background graphic and the opacity set to 0.1

Style shown: Dark Copper iOS Style, part of the 10.2 Tokyo Premium Styles Bonus Pack

 

Style shown: Clear Gulf Stream iOS Style, available for sale at DelphiStyles.com

 

Style shown: Material Oxford Blue iOS Style, available for sale at DelphiStyles.com

 

 

Native iOS UI shown

 

For a nice UI touch, I used the tab item fill color as the stroke color on the circle, and as the icon fill color for each of the custom icons shown in the listbox. When selecting listbox icons, it’s important to use pngs with some padding around the actual icon to ensure that the icon does not take up the entire height of the row. There are many great sites that offer free or paid icons. Some you can quickly customize online, others require a graphic design tool like Photoshop.

Example:

 

[DownloadButton Product=’RAD’ Caption=’Download a free trial and start building multi-device apps today!’]


Reduce development time and get to market faster with RAD Studio, Delphi, or C++Builder.
Design. Code. Compile. Deploy.
Start Free Trial   Upgrade Today

   Free Delphi Community Edition   Free C++Builder Community Edition

About author

Director of Product Management, Developer Tools Idera, Inc.
Related posts
DelphiShowcase

Plunge Into A Museum Adventure With This Delphi Integration

DelphiIDE

Automate Access To Current And Historical Currency Exchange Rates Via API

DelphiShowcase

Incredible Real-Time Mobile App Is Built With Delphi

DelphiShowcase

Powerful Real-Time Retail Dashboard App is Powered by Delphi

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

IN THE ARTICLES