如何为Odoo表单视图中的字段设置边距?
给Odoo表单字段添加下边距的解决方案
当然可以给字段设置下边距!在Odoo里,你有几种灵活的方式来调整表单元素的间距,下面我会结合你的代码给出具体实现方法:
方法1:通过字段的style属性直接设置
你可以给需要调整间距的字段直接添加style属性,指定margin-bottom值。比如修改你的字段代码:
<page name="personal_information" string="Información Personal"> <group> <group> <field name="numero_cuenta" style="margin-bottom: 12px;"/> <field name="sabe_leer" style="margin-bottom: 12px;"/> <field name="sabe_escribir" style="margin-bottom: 12px;"/> <field name="nivel_educativo" style="margin-bottom: 12px;"/> <field name="country_of_birth" string="Nacionalidad" style="margin-bottom: 12px;"/> </group> <group> <field name="adjunto_contrato" widget="download_link" filename="adjunto_contrato_filename" options="{'filename': 'adjunto_contrato_filename'}" style="margin-bottom: 12px;"/> <field name="adjunto_contrato_filename" readonly="1" invisible="1" force_save="1"/> <field name="adjunto_copia_cedula" widget="download_link" filename="adjunto_copia_cedula_filename" options="{'filename': 'adjunto_copia_cedula_filename'}" style="margin-bottom: 12px;"/> <field name="adjunto_copia_cedula_filename" readonly="1" invisible="1" force_save="1"/> <field name="adjunto_acta" widget="download_link" filename="adjunto_acta_filename" options="{'filename': 'adjunto_acta_filename'}" style="margin-bottom: 12px;"/> <field name="adjunto_acta_filename" readonly="1" invisible="1" force_save="1"/> </group> </group> </page>
注意:那些隐藏的字段(比如adjunto_contrato_filename)不需要设置,因为它们不会在页面上显示。
方法2:使用自定义CSS类(更优雅的批量处理)
如果要给多个字段统一设置间距,推荐用自定义CSS类,这样维护起来更方便:
- 先在你的模块中创建一个CSS文件(比如
static/src/css/custom_form.css),添加样式:
.form-field-margin { margin-bottom: 12px !important; }
- 在你的视图中,给需要的字段添加
class属性:
<page name="personal_information" string="Información Personal"> <group> <group> <field name="numero_cuenta" class="form-field-margin"/> <field name="sabe_leer" class="form-field-margin"/> <field name="sabe_escribir" class="form-field-margin"/> <field name="nivel_educativo" class="form-field-margin"/> <field name="country_of_birth" string="Nacionalidad" class="form-field-margin"/> </group> <group> <field name="adjunto_contrato" widget="download_link" filename="adjunto_contrato_filename" options="{'filename': 'adjunto_contrato_filename'}" class="form-field-margin"/> <field name="adjunto_contrato_filename" readonly="1" invisible="1" force_save="1"/> <field name="adjunto_copia_cedula" widget="download_link" filename="adjunto_copia_cedula_filename" options="{'filename': 'adjunto_copia_cedula_filename'}" class="form-field-margin"/> <field name="adjunto_copia_cedula_filename" readonly="1" invisible="1" force_save="1"/> <field name="adjunto_acta" widget="download_link" filename="adjunto_acta_filename" options="{'filename': 'adjunto_acta_filename'}" class="form-field-margin"/> <field name="adjunto_acta_filename" readonly="1" invisible="1" force_save="1"/> </group> </group> </page>
- 别忘了在模块的
__manifest__.py中引入这个CSS文件:
'assets': { 'web.assets_backend': [ 'your_module_name/static/src/css/custom_form.css', ], },
方法3:调整整个组的间距(如果组内所有元素都需要)
如果某个group里的所有字段都需要统一间距,也可以直接给group添加样式:
<group style="margin-bottom: 15px;"> <!-- 这里面的字段都会继承组的间距 --> </group>
你可以根据自己的需求选择合适的方法,建议用第二种方式,后期如果要调整间距大小,只需要修改CSS文件就行,不用一个个改字段~
内容的提问来源于stack exchange,提问作者Ernesto Ruiz
相关产品推荐
相关产品推荐

