appdoo (Mac) Documentation

List View

A “List View” displays any number of equal parts as a list. This list is scrollable and usually covers the entire screen. Single entries can be tapped optionally. A tap can be used, for example, to go from a news overview to a news detail page.

Of course, you can also configure the appearance of the List View.

Properties

To show the properties of the List View, click the Properties tab (the slider icon) in the upper right sidebar.

List View

• Name
  Here you give the element a name. This name is only used within appdoo. For example, you can quickly see in the outline where each List View is located. You can also edit the name by double-clicking on the List View in the outline. We recommend that you assign unique names when working with Layout Constraints and Data Links.

• Rows
  Here you specify the number of rows in the List View. This value is not used if you have activated the “Use Data Source” checkbox. If this is the case, the number of rows is determined dynamically by the content of the data source.

• Use Data Source
  Activate this checkbox if the content of the List View comes from a data source (RSS 2.0 Feed, Atom Feed, JSON container, …).

  • Data Source List
    If the checkbox “Use Data Source” is activated, there is a list of the Data Sources of your screen below. Select a Data Source from this list by clicking on it. The selected entry is shown inverted.

  • New Data Source
    By clicking on this button, the possible types of a new Data Source are shown and you can create a corresponding new Data Source by clicking on a type. The following types are available:

    • Textual List
    • Atom Feed
    • CSV
    • JSON
    • RSS 2.0 Feed
    • Data Filter

  • Use a Navigation Target
    In addition to displaying values in the List View, you may also want to allow the user of your app to navigate further. For example, from a news overview (this List View) to a detail page. To realize this, the checkbox “Use a Navigation Target” must be activated. This will first ask you whether you want to use an existing screen as the target or whether you want a new screen to be created automatically. You will then be offered further settings. For example, you can change the selection for the target screen once again and also specify the effect with which the new screen is to be displayed.

    If you have activated this option, then you can of course reach the selected target screen within appdoo with a single click. The row itself should not be selected. If the List View or nothing is selected and you move the mouse pointer over a row of the List View, a button (circle) with an arrow is displayed on the right side. Clicking on this button takes you directly to the target screen.

    The corresponding data record of the row is also passed to the next screen with this click and is available there in the list of elements as “Context-sensitive data”.

• Header Row
  Activate this checkbox if you want to insert another entry above the first entry. This entry is already slightly higher by default and independent of any Data Sources that may be used. In this “Header Row” you can add as many elements as you like like “Labels”, “Rectangles”, “Image Views” etc.. Simply drag the desired element from the list of elements to the entry “Header Row” of the outline.

• Footer Row
  Activate this checkbox if you want to insert another entry above the last entry. This entry is already slightly higher by default and independent of any Data Sources that may be used. In this “Footer Row” you can add as many elements as you like like “Labels”, “Rectangles”, “Image Views” etc.. Simply drag the desired element from the list of elements to the entry “Footer Row” of the outline.

• Background Color
  Here you define the background color of your List View.

• Separator Color
  Here you specify the color of the lines between the entries of your List View.

  

• Allow Selection
  Activate this checkbox to allow the user of your app to tap on the rows of the “List View”. This is useful, for example, if you want to be able to switch to the next screen by tapping on a entry.

Separator Insets

• Default
  Select this checkbox to use the default values (of the iOS version installed on the device) for the indentations.

• Left
  Here you can specify how far the separator should be indented from the left.

• Right
  Here you can specify how far the separator should be indented from the right.

Scroll Insets

• Above
  Here you can define the distance above the first entry.

  • Estimate
    This button is only important for you if you have a Navigation Bar on the screen on which your List View is located and have activated the checkbox “Translucent”. If this is the case, then the List View is below the Navigation Bar and the first entries would be hidden by it. This means that a margin must be inserted above the first entry to make it immediately visible when the screen appears. By clicking on the “Estimate” button, this distance is determined and entered in the “Above” field.

• Beneath
  Here you can define the distance below the last entry.

  • Estimate
    This button is only important for you if you have a Tab Bar on the screen on which your List View is located and have activated the checkbox “Translucent”. If this is the case, the List View is under the Tab Bar and the last entries would be hidden by it. This means that a margin must be inserted below the last entry. By clicking on the “Estimate” button, this distance is determined and entered in the “Beneath” field.

Advanced

• Hidden

  If you activate the “Hidden” checkbox, your List View will still be present on your work space, but will not be displayed. This can be useful, for example, if you only want to display the List View under certain circumstances. You can control this via the “Hidden” field in the “Data Links” area.

Geometry

All information about this area can be found on the separate Geometry page.

Data Links

The following properties of the element can be set using the data links:

• Hidden
• Selected Cell (0-Index)

All information about this area can be found on the separate Data Links page.