To ensure a uniform experience for customers, consider
customizing the document form within Odoo for consistent
styling. Various styling choices are available for enhancing
the form's appearance.
Header Element
Utilize the header element to incorporate buttons or status
bars at the beginning of a form.
For example,
<header>
<button name="action_quotation_send" string="Send by Email"
type="object" states="draft" class="btn-primary"
data-hotkey="g"/>
<button name="action_cancel" type="object" string="Cancel"
attrs="{'invisible': ['|', ('state', 'not in', ['draft', 'sent','sale']), ('id', '=', False)]}"
data-hotkey="z"/>
<button name="action_draft" states="cancel" type="object"
string="Set to Quotation" data-hotkey="w"/>
<field name="state" widget="statusbar"
statusbar_visible="draft,sent,sale"/>
</header>
Sheet Element
The "sheet" element in a form view is utilized to create a
structured and visually organized layout, allowing for the
grouping of fields and other elements within a tabular format
for improved user interface design.
<sheet>
<group>
<group>
<field name="name"/>
<field name="patient_id"/>
</group>
<group>
<field name="doctor"/>
<field name="date"/>
</group>
</group>
</sheet>
Smart Button
Smart buttons enable the retrieval of additional records
associated with the current object, resulting in the addition
of interactive buttons at the top of the sheet.
<div class="oe_button_box" name="button_box">
<button type="object" name="action_reconcile_stat"
class="oe_stat_button" icon="fa-book">
<field name="number_entries"
string="Journal Entries" widget="statinfo"/>
</button>
</div>
Prominent fields
If there are any prominent fields, prioritize them at the
beginning.
<div class="oe_title">
<h1>
<field name="name" class="oe_inline"/>
</h1>
</div>
Notebook
When dealing with numerous fields on the form, organizing them
as notebook pages can be a practical approach.
<notebook>
<page string="Internal Notes" name="internal_notes">
<field name="description"
placeholder="Add a description..."
options="{'collaborative': true}"/>
</page>
</notebook>
It is possible to incorporate additional pages into a
notebook.
Chatter widget
To include a chatter in your form, you can integrate it after
concluding the sheet element.
<div class="oe_chatter">
<field name="message_follower_ids"/>
<field name="activity_ids"/>
<field name="message_ids"
options="{'post_refresh': 'recipients'}"/>
</div>