In Odoo development, views are defined using XML rather than standard HTML. While Odoo eventually renders these as HTML in your browser, the developer defines them using specific Odoo-defined XML tags.
Here is the structural syntax for the most common view types in Odoo 17.
1. Form View (<form>)
The Form view uses a combination of structural tags like <header> (for buttons/status), <sheet> (the main content area), and <group> (for layout columns).
<record id="view_model_name_form" model="ir.ui.view">
<field name="name">model.name.form</field>
<field name="model">model.name</field>
<field name="arch" type="xml">
<form>
<header>
<button name="action_confirm" string="Confirm" type="object" class="oe_highlight"/>
<field name="state" widget="statusbar"/>
</header>
<sheet>
<group>
<group>
<field name="name"/>
<field name="date"/>
</group>
<group>
<field name="user_id"/>
<field name="priority" widget="priority"/>
</group>
</group>
<notebook>
<page string="Description" name="description">
<field name="description_html" widget="html"/>
</page>
</notebook>
</sheet>
</form>
</field>
</record>
2. List / Tree View (<tree>)
In Odoo 17, the tag remains <tree>, though it is often referred to as the "List" view in the UI.
<tree string="Records List" decoration-info="state == 'draft'" multi_edit="1">
<field name="name"/>
<field name="date"/>
<field name="user_id" widget="many2one_avatar_user"/>
<field name="state" widget="badge"/>
</tree>
3. Kanban View (<kanban>)
Kanban views use a subset of QWeb (Odoo's templating engine) inside the <templates> tag to define the card's HTML-like structure.
<kanban default_group_by="state">
<field name="id"/>
<field name="color"/>
<templates>
<t t-name="kanban-box">
<div t-attf-class="oe_kanban_global_click">
<div class="oe_kanban_details">
<strong class="o_kanban_record_title">
<field name="name"/>
</strong>
<div>
<field name="date"/>
</div>
</div>
</div>
</t>
</templates>
</kanban>
4. Search View (<search>)
The search view defines which fields are searchable and which "Group By" options appear in the filter menu.
<search>
<field name="name" string="Keyword" filter_domain="['|', ('name', 'ilike', self), ('description', 'ilike', self)]"/> <filter string="My Records" name="my_records" domain="[('user_id', '=', uid)]"/><group expand="0" string="Group By">
<filter string="Status" name="status" context="{'group_by': 'state'}"/></group>
</search>
5. Pivot & Graph Views (<pivot>, <graph>)
These are used for reporting. Pivot views define rows and columns, while Graph views define the visual chart type.
<pivot string="Analysis">
<field name="date" type="row"/>
<field name="user_id" type="col"/>
<field name="amount" type="measure"/>
</pivot>
<graph string="Sales Statistics" type="bar" sample="1">
<field name="user_id"/>
<field name="amount" type="measure"/>
</graph>
