Table of Contents

Custom Screen


The method of creating custom screens requires at least essential knowledge of developing Android and XML files system. Otherwise, we recommend using already-created skins. To edit them, use just a simple NotePad or any text editing software with XML syntax highlight (for example Notepad++)

For most people who want to create their own screens should be enough to use a much simpler dashboard system that offers similar functionality in a much less painful way.

However, Dashboard is available only with Premium and misses some advanced possibilities like rotating images, completely free layout etc.

Method using Eclipse

  1. Download and install Eclipse and Android SDK tools from here >>.
  2. When all works, create a new Android project. This will create a basic data structure. You'll not need to program anything.
  3. The project contains res/layout/main.xml file - that's our target. Learn to work with Eclipse GUI builder and edit this file.
  4. Put resources (best to use 9-patch images) into res folders (supported - drawable, drawable-hdpi, drawable-mdpi, drawable-ldpi)
  5. After compilation, take mail.xml file and image resources from compiled source (this is because of 9-patch images. If you want to use basic .png files, you can add them directly into the result. 9-patch have to be pre-compiled!).

Using basic text editor

You do not have to do the previous steps. You can edit XML files directly in any editor. The previous steps are just recommended ways for easy “Drag and drop” creating and also the only way to support 9-patch images!

How to make it work

root directory: ./Locus/data/customScreen/

Create .ZIP file that contains this structure:

    /assets/ - for custom fonts
    /drawable/ - (9-patch, or universal)
    /drawable-hdpi/
    /drawable-ldpi/
    /drawable-mdpi/
    /layout/ - for layout specification (for landscape and portrait or... below... for separate by orientation)
    /layout-land/
    /layout-port/
    /values/ (supported colors.xml, styles.xml)

Place your main layout file into the layout directory (or two files, one to layout-land, second to layout-port) and rename it to main.xml. That is important because main.xml file is the gate to the whole layout, it has to be included!

You can place these files also in the root of your .ZIP file (optional)

Finally, place this .zip file into the root directory described above!

Supported Views

Containers

Views

Sample - let's imagine this image of the compass:

To make it work in full screen width you need to define these parameters:

    android:layout_width="match_parent"
    android:layout_height="X"
    locus:action="{orient_course}"
    locus:slideImage="X"
    locus:slideStartPosition="0dip"
    locus:slideStartValue="180"
    locus:slideEndPosition="match_parent"
    locus:slideEndValue="-180"
    locus:slideInfinite="[true]"

By this definition, you say that:

  • 1. if the orientation angle is 180°, the first pixel (slideStartPosition) will be drawn really as the first pixel. Because the defined whole range is from 0° - 360° and the end value has a position on the end (locus:slideEndPosition=“match_parent”), the image will be stretched over the whole screen. The middle of the image (S), will be in the middle, as we want!
  • 2. if orientation is for example 90°, Locus Map first computes the percent part of the image that should be moved. It's computed by (current value - slideStartValue) / (slideEndValue - slideStartValue), so in this case it's (90 - 180) / (-180 - 180) = 25%!. This means that image will be moved by 25%

Global attributes

All Views can be applied with these attributes:

Custom attributes

locus:actionClick

locus:actionVisibility

locus:textFont

locus:textFormat