<h1>odoo14 觀念 - image mixin</h1> <p>建議觀看影片, 會更清楚:smile:</p> <p><a href="https://youtu.be/2EJNTLldHOA">Youtube Tutorial - odoo14 手把手教學 - image mixin</a></p> <p>建議在閱讀這篇文章之前, 請先確保了解看過以下的文章 (因為都有連貫的關係)</p> <p><a href="https://github.com/twtrubiks/odoo-demo-addons-tutorial/tree/master/demo_odoo_tutorial">odoo 手把手建立第一個 addons</a></p> <p>本篇文章主要介紹 odoo 14 中的 <code>image.mixin</code> 這個 model.</p> <p>這個 model 適合使用在需要產生不同尺寸大小的圖片.</p> <h2>說明</h2> <p>這邊要注意一下, <code>image.mixin</code> 是 odoo13 odoo14 開始才有的,</p> <p>(odoo12 是沒有這個 <code>image.mixin</code> model)</p> <p>如果你對 Mixin 有興趣, 也可參考 <a href="https://github.com/twtrubiks/python-notes/tree/master/what_is_the_mixin">什麼是 Mixin in python</a>:smile:</p> <p>可參考 odoo14 原始碼中的 <code>odoo/addons/base/models/image_mixin.py</code></p> <p>```python ......</p> <p>class ImageMixin(models.AbstractModel): _name = &#39;image.mixin&#39; _description = &quot;Image Mixin&quot;</p> <pre><code># all image fields are base64 encoded and PIL-supported image_1920 = fields.Image(&quot;Image&quot;, max_width=1920, max_height=1920) # resized fields stored (as attachment) for performance image_1024 = fields.Image(&quot;Image 1024&quot;, related=&quot;image_1920&quot;, max_width=1024, max_height=1024, store=True) image_512 = fields.Image(&quot;Image 512&quot;, related=&quot;image_1920&quot;, max_width=512, max_height=512, store=True) image_256 = fields.Image(&quot;Image 256&quot;, related=&quot;image_1920&quot;, max_width=256, max_height=256, store=True) image_128 = fields.Image(&quot;Image 128&quot;, related=&quot;image_1920&quot;, max_width=128, max_height=128, store=True) </code></pre> <p>...... ```</p> <p>這邊也請特別注意一下他是 <code>AbstractModel</code>.</p> <p>關於 <code>AbstractModel</code> 的特性, 之前的文章裡也有介紹過,</p> <p>請參考 <a href="https://github.com/twtrubiks/odoo-demo-addons-tutorial/tree/master/demo_abstractmodel_tutorial">介紹 AbstractModel</a></p> <p>寫法很簡單, 只需要繼承 <code>image.mixin</code> 即可,</p> <p>先來看 <a href="https://github.com/twtrubiks/odoo-demo-addons-tutorial/blob/14.0/demo_image_mixin/models/model.py">models/model.py</a></p> <p>```python from odoo import models, fields, api</p> <p>class DemoImage(models.Model): _name = &#39;demo.image&#39; _description = &#39;Demo Image&#39; _inherit = [&#39;image.mixin&#39;]</p> <pre><code>name = fields.Char(string=&#39;Name&#39;, required=True) # image_1920 = fields.Image(required=True) </code></pre> <p>```</p> <p>你沒看錯, 就是直接繼承 <code>image.mixin</code>.</p> <p>然後他會有幾個特性,</p> <p>首先, 這些 images fields 不會在資料庫中產生對應的 table (但你可以使用 fields).</p> <p>再來是只有 <code>image_1920</code> 是可編輯(寫)得, 其他的 <code>image_1024</code> <code>image_512</code>......</p> <p>都是只能讀而已 (原因是他們都有 <code>related=&quot;image_1920&quot;</code>),</p> <p>當你編輯 <code>image_1920</code> 時, 會自動產生出其他的尺寸.</p> <p>如果今天你想要讓 <code>image_1920</code> 必填, 也直接覆蓋掉即可, 如同我註解寫的那樣.</p> <p><a href="https://github.com/twtrubiks/odoo-demo-addons-tutorial/blob/14.0/demo_image_mixin/views/view.xml">views/view.xml</a> 的部份</p> <p><code>xml ...... &lt;record id=&quot;view_form_demo_image&quot; model=&quot;ir.ui.view&quot;&gt; &lt;field name=&quot;name&quot;&gt;Demo Image Form&lt;/field&gt; &lt;field name=&quot;model&quot;&gt;demo.image&lt;/field&gt; &lt;field name=&quot;arch&quot; type=&quot;xml&quot;&gt; &lt;form&gt; &lt;group&gt; &lt;field name=&quot;name&quot;/&gt; &lt;field name=&quot;image_1920&quot; widget=&quot;image&quot; options=&quot;{&#39;preview_image&#39;: &#39;image_128&#39;}&quot; /&gt; &lt;field name=&quot;image_256&quot; widget=&quot;image&quot;/&gt; &lt;field name=&quot;image_128&quot; widget=&quot;image&quot;/&gt; &lt;/group&gt; &lt;/form&gt; &lt;/field&gt; &lt;/record&gt; ...... </code></p> <p>你可以看到這邊除了 <code>image_1920</code> fields 之外, 也可以使用其他的尺寸</p> <p><code>image_128</code> <code>image_256</code>....</p> <p><img src="https://i.imgur.com/cIaIBUX.png" alt="alt tag"></p> <p><img src="https://i.imgur.com/bzbzNOP.png" alt="alt tag"></p> <p>如果你只想要產生單一圖片, 不需要其他的尺寸, 還是可以直接使用 <code>fields.Binary</code>.</p> <p>最後提醒大家, 超大容量的圖片, 對網站絕對是一個負擔, 不只網路變慢, SEO的排名</p> <p>可能也會往後掉, 所以, 建議使用適合的圖片大小:smile:</p>