當前位置:首頁 ? tkinter ? 正文

用tkinter做一個不規則的任意形狀的異形窗體

不規則窗體制作的原理

網上??吹接脛e的編程語言做的不規則的,任意形狀的異形窗體,就是提供一個圖片作為背景,要透明的部分就要專門設定一個特殊的顏色,比如粉紅色,加上相應的代碼,就可以做一個圖片形狀的一個窗體。

其實用tkinter也可以做這種異形窗體的,做異形窗體主要牽涉到2個知識點(只要2行代碼):

   root.overrideredirect(True) # 讓窗體無標題欄

   root.wm_attributes("-transparentcolor", "white") # 設置窗體某種顏色透明

  上面這行代碼,是讓窗體的白色部分透明。這第2個參數,可以起用用顏色名,如’red’,’blue’ 等,也可以用顏色的16進制來表示,如白色用16進制表示為’#FFFFFF’   注意,16進制用#開頭,同時也要用引號括起來。

  下面我們就用做一個小狗的窗體。下面是小狗的png格式圖:

202111151020143304992.png

這個小狗尺寸為 132 X 102  狗周圍的顏色為白色。我們編程規劃:

1,先創建一個窗體,尺寸為132x102

2, 創建一個標簽,用于顯示小狗的圖片

3,用代碼 root.overrideredirect(True) 讓窗體無標題欄

4,用代碼 root.wm_attributes("-transparentcolor", "white") 讓窗體的白色部分透明

5,增加鼠標左鍵按下標簽,移動窗體的代碼

6,增加一個彈出菜單,方便退出程序(雙擊標簽退出程序也行)

先創建透明顏色窗體

以下是創建透明小狗窗體的代碼,雙擊小狗可退出窗體:         丶丌皛

from tkinter import *
 
def exit(event):
    root.destroy()  # 鼠標雙擊小狗退出程序
 
root=Tk() # 源碼來自wb98.com
root.geometry('132x103+888+444')  # 窗體的尺寸正好是圖片小狗的圖片
 
img1=PhotoImage(file='gou1.png') # 創建圖片對像
la1=Label(root, image=img1,bd=0)  # 創建標簽,標簽邊框寬度為0
la1.place(x=0,y=0) # 用place定位
 
la1.bind("<Double-Button-1>",exit) # 鼠標雙擊標簽小狗綁定exit函數
 
root.overrideredirect(True) # 讓窗體無標題欄
# root.wm_attributes("-transparentcolor", "white") # 設置窗體白色透明
root.wm_attributes("-transparentcolor", "#FFFFFF") # 白色用16進制#FFFFFF代替
 
root.mainloop()

增加可移動小狗窗體的代碼

下面我增加移動無標題欄窗體的代碼。(移動無標題欄窗體代碼的講解見我的專門文章),增加了標簽綁定3個函數,全部代碼如下:

from tkinter import *
 
def MouseDown(event):
    global moveYN # 是否可以移動窗體的全局變量
    global mousX  # 全局變量,鼠標在窗體內的x坐標
    global mousY  # 全局變量,鼠標在窗體內的y坐標
 
    moveYN=True    # 打開移動窗體的開關
    mousX=event.x  # 獲取鼠標相對于窗體左上角的X坐標
    mousY=event.y  # 獲取鼠標相對于窗左上角體的Y坐標
    
def MouseUp(event):
    moveYN=False   # 關閉移動窗體的開關
def MouseMove(event): 
    if moveYN==True: # 如果鼠標按下,就可以移動窗體到新的位置
        root.geometry(f'+{event.x_root - mousX}+{event.y_root - mousY}') 
def exit(event):
    root.destroy()  # 退出程序
 
root=Tk()
root.geometry('132x103+888+444')  # 窗體的尺寸正好是圖片小狗的圖片
 
img1=PhotoImage(file='gou1.png') # 創建圖片對像
la1=Label(root, image=img1,bd=0)  # 創建標簽,標簽邊框寬度為0
la1.place(x=0,y=0) # 用place定位
 
la1.bind("<Double-Button-1>",exit) # 鼠標雙擊標簽小狗綁定exit函數
 
root.overrideredirect(True) # 讓窗體無標題欄
root.wm_attributes("-transparentcolor", "white") # 設置窗體白色透明
 
la1.bind("<Button-1>",MouseDown) # 鼠標按下綁定函數,決定可以移動窗體
la1.bind("<ButtonRelease-1>",MouseUp) # 鼠標抬起綁定函數,決定不能移動窗體
la1.bind("<B1-Motion>",MouseMove) # 鼠標按下并移動綁定函數,決定窗體移動到新的位置
 
root.mainloop()  # 源碼來自www.chinaengraver.com

運行后,就可以用鼠標移動小狗窗體,雙擊小狗就可以關閉窗體。

為無標題欄窗體增加右鍵彈出菜單

下面我為窗體增加彈出菜單代碼,這樣,用鼠標右鍵彈出菜單方式也可以退出窗體。全部代碼如下

from tkinter import *
import webbrowser
def wb98():
    webbrowser.open('http://www.wb98.com',new=1)
 
def MouseDown(event):
    global moveYN # 是否可以移動窗體的全局變量
    global mousX  # 全局變量,鼠標在窗體內的x坐標
    global mousY  # 全局變量,鼠標在窗體內的y坐標
 
    moveYN=True    # 打開移動窗體的開關
    mousX=event.x  # 獲取鼠標相對于窗體左上角的X坐標
    mousY=event.y  # 獲取鼠標相對于窗左上角體的Y坐標
    
def MouseUp(event):
    moveYN=False   # 關閉移動窗體的開關
def MouseMove(event): 
    if moveYN==True: # 如果鼠標按下,就可以移動窗體到新的位置
        root.geometry(f'+{event.x_root - mousX}+{event.y_root - mousY}') 
def exit(event):
    root.destroy()  # 退出程序
def popup_menu(event):  # 彈出菜單代碼
    popup.post(event.x_root,event.y_root) 
 
root=Tk()
root.geometry('132x103+888+444')  # 窗體的尺寸正好是圖片小狗的圖片
 
img1=PhotoImage(file='gou1.png') # 創建圖片對像
la1=Label(root, image=img1,bd=0)  # 創建標簽,標簽邊框寬度為0
la1.place(x=0,y=0) # 用place定位
 
la1.bind("<Double-Button-1>",exit) # 鼠標雙擊標簽小狗綁定exit函數
 
root.overrideredirect(True) # 讓窗體無標題欄
root.wm_attributes("-transparentcolor", "white") # 設置窗體白色透明
 
la1.bind("<Button-1>",MouseDown) # 鼠標按下綁定函數,決定可以移動窗體
la1.bind("<ButtonRelease-1>",MouseUp) # 鼠標抬起綁定函數,決定不能移動窗體
la1.bind("<B1-Motion>",MouseMove) # 鼠標按下并移動綁定函數,決定窗體移動到新的位置   
 
popup=Menu(root,tearoff=0) # 為彈出菜單創建菜單popup
popup.add_command(label='作者濟亨網',command=wb98) # 創建菜單項
popup.add_command(label='退出',command=root.destroy) # 退出菜單項也可以退出程序
 
root.bind("<Button-3>",popup_menu) # 窗體鼠標右鍵綁定彈出菜單函數
 
root.mainloop()


運行程序,可以達到規劃好的目的,基本上就做好了一個異形窗體的程序。

但我稍有些不滿意,因為我是用下面代碼設置窗體的尺寸為小狗的尺寸:

root.geometry('132x103+888+444')  # 窗體的尺寸正好是圖片小狗的圖片

這要先了解圖像的尺寸,再來寫代碼,如果讓程序來判斷圖像的尺寸行不行呢?當然行,我再在代碼最后加入判斷圖像尺寸的代碼,并注釋掉窗體強形設置尺寸的代碼??紤]到程序沒有標題欄,在任務欄無法有圖標,有時找不到程序界面,在程序開始時,就讓程序界面置頂;程序在啟動時,界面由默認位置移動到屏幕正中間,有一個閃動的過程,我在程序剛開始加入讓窗體隱藏的代碼,再到程序最后讓隱藏的界面再顯示,可以解決界面有閃動的情況。全部代碼如下:

from tkinter import *
import webbrowser
def wb98():
    webbrowser.open('http://www.wb98.com',new=1)
 
def MouseDown(event):
    global moveYN # 是否可以移動窗體的全局變量
    global mousX  # 全局變量,鼠標在窗體內的x坐標
    global mousY  # 全局變量,鼠標在窗體內的y坐標
 
    moveYN=True    # 打開移動窗體的開關
    mousX=event.x  # 獲取鼠標相對于窗體左上角的X坐標
    mousY=event.y  # 獲取鼠標相對于窗左上角體的Y坐標
    
def MouseUp(event):
    moveYN=False   # 關閉移動窗體的開關
def MouseMove(event): 
    if moveYN==True: # 如果鼠標按下,就可以移動窗體到新的位置
        root.geometry(f'+{event.x_root - mousX}+{event.y_root - mousY}') 
def exit(event):
    root.destroy()  # 退出程序
def popup_menu(event):  # 彈出菜單代碼
    popup.post(event.x_root,event.y_root) 
 
root=Tk()  # 源碼來自wb98.com
root.withdraw()  # 讓窗體隱藏一下
root.wm_attributes('-topmost',1)  # 讓窗體置頂
 
# root.geometry('132x103+888+444')  # 窗體的尺寸正好是圖片小狗的圖片
 
img1=PhotoImage(file='gou1.png') # 創建圖片對像
la1=Label(root, image=img1,bd=0)  # 創建標簽,標簽邊框寬度為0
la1.place(x=0,y=0) # 用place定位
 
la1.bind("<Double-Button-1>",exit) # 鼠標雙擊標簽小狗綁定exit函數
 
root.overrideredirect(True) # 讓窗體無標題欄
root.wm_attributes("-transparentcolor", "white") # 設置窗體白色透明
 
la1.bind("<Button-1>",MouseDown) # 鼠標按下綁定函數,決定可以移動窗體
la1.bind("<ButtonRelease-1>",MouseUp) # 鼠標抬起綁定函數,決定不能移動窗體
la1.bind("<B1-Motion>",MouseMove) # 鼠標按下并移動綁定函數,決定窗體移動到新的位置   
 
popup=Menu(root,tearoff=0) # 為彈出菜單創建菜單popup
popup.add_command(label='作者濟亨網',command=wb98) # 創建菜單項
popup.add_command(label='退出',command=root.destroy) # 退出菜單項也可以退出程序
 
root.bind("<Button-3>",popup_menu) # 窗體鼠標右鍵綁定彈出菜單函數
 
root.update() # 刷新窗體數據
 
a=la1.winfo_width() # 標簽1的寬度
b=la1.winfo_height() # 標簽1的高度
c=(root.winfo_screenwidth()-a)/2 # 居中顯示的左邊界
d=(root.winfo_screenheight()-b)/2 # 居中顯示的上邊界
root.geometry('%dx%d+%d+%d' % (a,b,c,d)) # 在屏幕居中顯示
 
root.wm_deiconify()  # 讓窗體顯現
 
root.mainloop()


運行程序,達到了效果,大家可以反三,做其它形狀的窗體界面。如下面的手機圖。
sj.PNG

我們只需要改動2處代碼就行了,1是把界面白色部分透明的代碼,改成粉紅(Fuchsia),或者用16進制 #FF00FF,改動代碼為:

root.wm_attributes("-transparentcolor", "fuchsia") # 設置窗體粉色透明

或者

root.wm_attributes("-transparentcolor", "#FF00FF") # 設置窗體白色透明

第2處改動代碼是創建圖片對象代碼,改file的文件名

img1=PhotoImage(file='sj.png') # 創建圖片對象

 

我把代碼改動后,運行結果 ,達到了預期的目的,大家可以試一下。也可以找別的圖片來試一下。

此文章來自:wb98.com  網站還有相關的系列課程文章,感興趣的可以前往。

 

 


來源:濟亨網

本文鏈接:http://www.chinaengraver.com/post/329.html

    << 上一篇 下一篇 >>

    湘公網安備 43011102000514號 - 湘ICP備08100508號

    2019年秋霞鲁丝片瓜皮_导航亚洲AV日韩AV永久无码_有没有哪些可以看片的免费的_国产色妞妞在线视频免费播放