TouchListLite - Usage tutorial
Last modified: April 10, 2012
Advantages
- Transparent images in your list (Alpha channel is supported for a *.png image)
- Custom background image
- Gradient background
- Vista style or gradient cursor with round corners
- Touch scrolling: finger friendly navigation
- With Margins you can define relative positions for items, so you will receive the same design for Landscape and Portrait
What is what?
TImage
This class allows you to specify the source of your image. You can either load image from a file (ImageFromFile property) or from the resources (ImageFromResx property). ImgeInDesigner property will be used for the Visual Studio designer only.
TImageList
It is a collection of TImage.
Tip:
TouchListLite control
Helps you to create a simple list with 2 transparent Image items and 2 Text items in a row.
Preparing Transparent Images for your TouchListLite
1. Add your images to the project and in Properties window set „Build Action“ to „Embedded Resource“ if you would like to store your images in resources, and set to „Content and Copy to Output Directory“ property to „Copy If Newer“ if you prefer to load them from your disk.
2. Drag and drop TImageList from your Toolbox into your Form.
3. Click on TimageList’s Images property to add your images.
4. Use ImageFromFile property if you prefer loading from file. The value of this property is the relative path to your application.
5. Use ImageFromResx property if you prefer loading from resources. The value of this property is: [YourNamespace].[Directory].[FileName]
How to set up my first TouchList?
Drag and drop BeeMobile TouchListLite control from Visual Studio’s Toolbox into your Form, then click on Items property to open the editor and specify your rows.
One row’s format is:
Left Image‘s index | Text1.Text | Text2.Text | Right Image‘s index
Now you can adjust the:
- Left image by properties in Item – Left Image category
- Right image by properties in Item – Right Image category
- Text1 by properties in Item – Text1 category
- Text2 by properties in Item – Text2 category
Margins help you to define area for an item, and you can prevent the intersecting of two items in a row.
The Alignment property works in the specified area that you defined by Margins.