Hyperview

Hyperview

  • Guides
  • Examples
  • Reference
  • Blog

›Display Elements

Reference

  • Index

Behaviors

  • Behavior Attributes
  • <behavior>
  • Alert
  • Share

Display Elements

  • <doc>
  • <screen>
  • <header>
  • <body>
  • <view>
  • <text>
  • <image>
  • <list>
  • <section-list>
  • <section>
  • <section-title>
  • <items>
  • <item>
  • <spinner>
  • <web-view>

Input Elements

  • <form>
  • <text-field>
  • <select-single>
  • <select-multiple>
  • <option>
  • <picker-field>
  • <picker-item>
  • <switch>
  • <date-field>

Style Elements

  • <styles>
  • <style>
  • <modifier>

Hyperview Client

  • Hyperview component
  • Custom elements
  • Custom behaviors
  • Loading Screen

Hyperview Navigation

  • <navigator>
  • <nav-route>

<section>


NOTE - DEPRECATED <section> is no longer required and has been marked deprecated; <section-title> and <item> elements may now be direct children of <section-list>.


The <section> element represents a group of items in a <section-list>. A section contains a title and items. The section itself does not have any visible style, it just serves as a grouping within the section list.

<section-list style="List">
  <section>
    <section-title style="Header">
      <text>Section 1</text>
    </section-title>

    <item key="a" style="Item">
      <text>Item 1</text>
    </item>
  </section>

  <section>
    <section-title style="Header">
      <text>Section 1</text>
    </section-title>

    <item key="b" style="Item">
      <text>Section 2</text>
    </item>
  </section>
</section-list>

Structure

A <section> element will only render <section-title>, <item> and <items> children elements. Other elements will be ignored during rendering.

A <section> element can only appear as a direct child of a <section-list> element. It will not render on the screen in other contexts.

Attributes

  • id
  • hide

id

TypeRequired
stringNo

A global attribute uniquely identifying the element in the whole document.

hide

TypeRequired
false (default), trueNo

If hide="true", the element will not be rendered on screen. If the element or any of the element's children have a behavior that triggers on "load" or "visible", those behaviors will not trigger while the element is hidden.

← <section-list><section-title> →
  • Structure
  • Attributes
Hyperview
Docs
ExamplesHyperview Reference
More
BlogGitHub
Copyright © 2025 Instawork