Skip ke Konten
Menu
Pertanyaan ini telah diberikan tanda
1 Balas
779 Tampilan

<button name="action_offer_accept"

type="object"

icon="fa-check"

class="btn-success"

string="Accept"

invisible="can_accept == False or state == 'accepted'"

/>

<button name="action_offer_refuse"

type="object"

icon="fa-times"

class="btn-danger"

string="Refuse"

invisible="can_accept == False"

/>

<field name="can_accept" invisible="True"/>


If one of the buttons "action_offer_accept" and "action_offer_refuse" is initially invisible=True and the other is visible, the first one doesn't take any space and no space is reserved for it. After setting invisible=False, it appears in a "second line" in the layout which is visually very unappealing and inconsistent compared to the option that both buttons are initially visible and in one "line". 

How to always "reserve" space for my buttons action_offer_accept and action_offer_refuse?


Avatar
Buang
Jawaban Terbai

To reserve space for both buttons and avoid layout shifting when one becomes visible, wrap them in a container like <div> or <group> and use the attrs attribute instead of invisible on the buttons:

<group>

    <button name="action_offer_accept"

            type="object"

            icon="fa-check"

            class="btn-success"

            string="Accept"

            attrs="{'invisible': [('can_accept', '=', False), ('state', '=', 'accepted')]}"/>


    <button name="action_offer_refuse"

            type="object"

            icon="fa-times"

            class="btn-danger"

            string="Refuse"

            attrs="{'invisible': [('can_accept', '=', False)]}"/>

</group>


i hope it is usefull

Avatar
Buang
Post Terkait Replies Tampilan Aktivitas
2
Des 23
12753
3
Jul 22
23137
2
Jun 21
18575
0
Sep 20
3726
0
Mei 16
4135