python圖形用戶介面(六):可視化給圖片添加上文字
- 2020 年 4 月 8 日
- 筆記
本系列課程是針對無基礎的,爭取用簡單明了的語言來講解,學習前需要具備基本的電腦操作能力,準備一個已安裝python環境的電腦。如果覺得好可以分享轉發,有問題的地方也歡迎指出,在此先行謝過。
前言
之前在圖形處理系列課程中,講過如何給圖片添加上文字,儘管通過程式設定,已經可以實現文本自動居中的效果,人的需求是會不斷變的,我們有時候可能並不想只放在中間,而是想要放到圖片的任意一個位置,用原來的方法改一改坐標也是可以實現的,不過會非常麻煩。如果可以可視化的操作,讓我們自己調整文字到我們想要的位置,那應該非常方便。
今天就來介紹如何自己設計一個可以進行可視化操作,給圖片添加上文字的方法。

可視化的核心其實就是讓可視化的操作變化對應轉化成實際變化,簡單點說,可視化時我們操作移動文字到左上角了,如何讓實際生成的圖片的文字也在左上角?比如可視化時我們x,y各減小100,實際要達到這種效果,我們就需要進行一個對應的轉化了,因為二者的坐標系統可能不一致,可能我們需要x,y各增大200。
我們操作的時候移動文字位置了,這裡只是給我們看的,如果直接就生成圖片,其實得到的結果並沒有變化;要想將這種移動變化轉化成實際的移動,我們需要計算二者的轉換關係,在生成的時候直接就將這種數值關係對應的實際變化中就實現了對應的效果。
效果展示
支援更改畫布大小和更改背景色,可以選擇保存圖片的類型(png和jpg)。

支援字體的修改,文字內容,顏色,大小,顯示位置。

如果不用默認的背景圖,也可以自己選擇圖片,同樣支援上面的功能。

實現思路:
1.功能構思。
畫布:使用一個標籤,支援大小和背景更改(使用滑動控制項和單行輸入框)
圖片選擇:使用一個按鈕和一個標籤
文本內容:使用一個標籤,支援大小,字體類型,顏色,顯色位置。(使用滑動控制項,字體下拉框控制項和單行輸入框)
保存:使用一個按鈕和一個下拉框。
2.UI布局設計。
功能較多,整個介面也比較大,這裡顯示的不完成,總體就是分為左右兩側布局,左側裡面採用垂直布局,裡面的每一個小功能採用的是水平布局。右側其實裡面有兩個標籤,分別用來顯示圖片和文字內容的。


3.轉換介面為python文件程式碼
利用pyside2-uic將ui文件轉換成py文件。


4.初始化介面


5.功能實現。
其實整體功能實現並不難,主要分為了幾個大部分,畫布區改變響應,畫布區裡面顯示的其實是圖片,所以這裡imgNew專門用來生成圖片的,textChange用來實現文本內容和樣式的改變,selectImg用來選擇圖片,最後一個saveImg用來生成保存圖片用的。


