最近接手的新客戶端專案是用qml做的介面。既然是客戶端,就需要用到各種彈窗,自然少不了自定義各種樣式的彈窗。模態視窗是最常用的彈窗之一,以下是我自定義的兩種模態視窗實現。第一種是基於window,第二種三基於rectangle,而我的專案**中不知道什麼原因大部分都是用了rectangle實現。
//基於window
window
rectangle
image }}
mousearea
onpositionchanged: }}
function setdlgpoint(dlgx,dlgy)
else if(rootwin.x + dlgx > rootwin.parent.width - rootwin.width + rootwin.parent.x)
else
if(rootwin.y + dlgy < rootwin.parent.y)
else if(rootwin.y + dlgy > rootwin.parent.height - rootwin.height + rootwin.parent.y)
else
}}
//基於rectangle,
rectangle
rectangle
rectangle
image }}
mousearea
onpositionchanged: }}
}function setdlgpoint(dlgx,dlgy)
else if(rootwin.x + dlgx > rootwin.parent.width - rootwin.width + rootwin.parent.x)
else
if(rootwin.y + dlgy < rootwin.parent.y)
else if(rootwin.y + dlgy > rootwin.parent.height - rootwin.height + rootwin.parent.y)
else
}}
基於rectangle的實現,是之程式上增加了乙個透明層,使得使用者不能操作彈窗後面的介面。這看似滿足了模態視窗的要求。但是存在乙個問題,就是之定義時設定的focus為true並沒有生效。這就是我專案中存在的兩個bug,找了好久才弄明白。
下面通過實際應用**展示bug的存在:由於focus不生效,彈窗中,如果設定輸入框的focus,依然沒有顯示游標閃動;彈窗也不會響應按鍵事件。
import qtquick 2.12
import qtquick.window 2.12
import qtquick.controls 2.0
window
}button
}modalwindowtemplate
//設定focus,但並沒有響應按鍵事件
focus: true
keys.enabled: true
keys.onpressed:
}//注釋這段**,彈出講無法響應按鍵
// onvisiblechanged:
// }
}windowtemplate
//設定focus,就可響應按鍵事件
focus: true
keys.enabled: true
keys.onpressed: }}
component.oncompleted:
}
所以個人建議還是老老實實用window吧。省得出各種奇怪的bug。 qml 自定義訊息框 Qml自定義元件的使用
component是可重用的 封裝的 具有定義良好的介面的qml型別。元件通常由元件檔案定義,即.qml檔案。元件型別本質上允許在qml檔案中內聯定義qml元件,而不是作為單獨的qml檔案。這對於在qml檔案中重用小組件或定義邏輯上屬於檔案中其它qml元件的元件可能很有用。1.在單獨檔案中定義com...
自定義UIAlertView模態框
在windows應用程式中,經常使用模態 model 對話方塊來和使用者進行簡單的互動,比如登入框。在ios應用程式中,有時我們也希望做同樣的事情。但ios的ui庫中,沒有模態對話方塊,最接近那個樣子的應該算是alertview。但僅用alertview,我們只能做文字提示,而不能和使用者做互動。本...
自定義模態轉場動畫
1.自定義模態檢視切換動畫 新建乙個類實現uiviewcontrolleranimatedtransitioning協議 這個類就是我們要用到的自定義的動畫切換類 import modeltransitionanimation.h 需要模態出來的控制器 import modelviewcontrol...