Flickable and Button
-
Inserting Buttons inside a Flickable is not necessarily a good idea overall. What is your intent?
-
I want to create a page has button and can scroll up and down。Do you have some good advice?
-
That solely depends on what kind of other controls or data you want to show. Is there a point for being able to flick an almost empty page?
-
no,there is many control in it ,and what I want to made is when I flick shield the button.
[quote author="Alek Śmierciak" date="1369638215"]That solely depends on what kind of other controls or data you want to show. Is there a point for being able to flick an almost empty page?[/quote]
-
my English is not very good...
how to create a page that when I flick,the button not answer -
Make use of onFlickStarted and onFlickEnded (or onMovementStarted and onMovementEnded)* signals of the "Flickable":http://harmattan-dev.nokia.com/docs/library/html/qt4/qml-flickable.html element and disable the button click between those two signals.
- the difference is documented "here":http://harmattan-dev.nokia.com/docs/library/html/qt4/qml-flickable.html#onFlickEnded-signal.
-
I try but the mousearea visible doesn't work!
-
You said you want to use a Button and prevent accidental clicks on it. Why do you mention MouseArea, which is a different element?
-
I mean those Button MouseArea's "visible" propery does not work,e...
can you write a simple example that a page contain some Button and some Text control,when flick the page Button does not answer -
I'm getting a feeling that you have mistaken MouseArea with Button elements. Please show us your code so we can tell you what's wrong.
-
Base_Button_Have_Arrow.qml
@
import QtQuick 1.1Item {
id: base_Button_Have_Arrow
width: 460
height: 60
property string base_Arrow_Button_Name
property string base_Arrow_Button_20_pixel_Text_Name_Right: ""
property string base_Arrow_Button_20_pixel_Text_Name_Middle:""
property int i_whichone: 0
signal bechecked(int i_whichone)Image{ id: base_Arrow_Button_BG width: parent.width height: 59 source: "pic/base/Button_BG_460_59.png" } Image { id: base_Arrow_Button_BG_List_01 x:0 y:0 width: parent.width height: 1 source: "pic/base/ButtonListUnPressed.png" } Image { id: base_Arrow_Button_BG_List_02 x : 0 y : 59 width: parent.width height: 1 source: "pic/base/ButtonListUnPressed.png" } Text { id: base_Arrow_Button_Text x: 10 y: 14 font.pixelSize:30 text: base_Arrow_Button_Name color: "white" } Image { id: base_Arrow_Button_Arrow x: 410 y: 0 width: 60 height: 59 source: "pic/base/ico_gen_ListArrow_30_b.png" } Text{ id:base_Arrow_Button_20pixelText_Right x: 340 y: 19 font.pixelSize: 20 text: base_Arrow_Button_20_pixel_Text_Name_Right color: "white" } Text{ id:base_Arrow_Button_20pixel_Text_Name_Middle x: 200 y: 19 font.pixelSize: 20 text: base_Arrow_Button_20_pixel_Text_Name_Middle color:"white" } MouseArea{ id:mouse_area_arrow anchors.fill: parent onPressed: { base_Arrow_Button_BG.source = "pic/base/Button_BG_Pushed.png" base_Arrow_Button_BG_List_01.source = "pic/base/Base_List.bmp" base_Arrow_Button_BG_List_02.source = "pic/base/Base_List.bmp" base_Arrow_Button_Text.color = "#ce0052" base_Arrow_Button_20pixelText_Right.color = "#ce0052" base_Arrow_Button_20pixel_Text_Name_Middle.color = "#ce0052" base_Arrow_Button_Arrow.source = "pic/base/ico_gen_ListArrow_30_bg.png" } onReleased: { base_Arrow_Button_BG.source = "pic/base/Button_BG_460_59.png" base_Arrow_Button_BG_List_01.source = "pic/base/ButtonListUnPressed.png" base_Arrow_Button_BG_List_02.source = "pic/base/ButtonListUnPressed.png" base_Arrow_Button_Text.color = "white" base_Arrow_Button_20pixelText_Right.color = "white" base_Arrow_Button_20pixel_Text_Name_Middle.color = "white" base_Arrow_Button_Arrow.source = "pic/base/ico_gen_ListArrow_30_b.png" base_Button_Have_Arrow.bechecked(i_whichone) } hoverEnabled: true }
}
@Diag_Common_Settings_General.qml
@
import QtQuick 1.1Item {
id: diag_Common_Settings_General
width: 480
height: 400
Flickable {
id: flick_DiagGeneral
width: parent.width
height: parent.height
contentWidth: parent.width
contentHeight: 610Text{ id: diagCommonSettingGeneral_Displays x: 9 y: 23 text: "Brightness" font.pixelSize: 30 color: "#ce0052" font.bold: true } Text{ id: diagCommonSettingGeneral_MMC x: 9 y: 85 text: "MMC" font.pixelSize: 30 color: "white" } Base_VolumeBar_10items{ id:diagCommonSettingGeneral_10itemsVolumeBar x: 240 y: 85 } Image{ id:diagCommonSettingGeneral_List_Gray x: 9 y: 130 width: 461 height: 1 source: "pic/base/Button_BG_460_59.png" } Text{ id: diagCommonSettingGeneral_Instr_backlight x: 9 y: 145 text:"Instr&backlight" font.pixelSize: 30 color: "white" } Base_VolumeBar_10items{ id: diagCommonSettingGeneral_10iteamsVolumeBar_Instr x: 240 y: 145 } Text { id: diagCommonSettingGeneral_Sound x: 9 y: 215 text: "Sound" font.bold: true font.pixelSize: 30 color: "#ce0052" } Base_Button_Have_Arrow{ id: diagCommonSettingGeneral_Speed_sens_vol x: 9 y: 261 base_Arrow_Button_20_pixel_Text_Name_Right: "Medium" base_Arrow_Button_Name:"Speed sensitive vol." } Text { id: diagCommonSettingGeneral_System x: 9 y: 345 text: "System" font.pixelSize: 30 color: "#ce0052" font.bold: true } Base_Button_Have_Arrow{ id: diagCommonSettingGeneral_Button_MapInfo x: 9 y : 391 base_Arrow_Button_Name: "Map info" } Base_Diag_General_White_Button_MMCReset{ id: diagCommonSettingGeneral_FacResetMMC x: 9 y: 460 } Base_Diag_General_White_Button_CarReset{ id: diagCommonSettingGeneral_FacResetCar x: 9 y: 530 } }
}
@
This is my previous code ,please... -
Diag_Common_Settings_General.qml
@import QtQuick 1.1Item {
id: diag_Common_Settings_General
width: 480
height: 400
Flickable {
id: flick_DiagGeneral
width: parent.width
height: parent.height
contentWidth: parent.width
contentHeight: 610Text{ id: diagCommonSettingGeneral_Displays x: 9 y: 23 text: "Brightness" font.pixelSize: 30 color: "#ce0052" font.bold: true } Text{ id: diagCommonSettingGeneral_MMC x: 9 y: 85 text: "MMC" font.pixelSize: 30 color: "white" } Base_VolumeBar_10items{ id:diagCommonSettingGeneral_10itemsVolumeBar x: 240 y: 85 } Image{ id:diagCommonSettingGeneral_List_Gray x: 9 y: 130 width: 461 height: 1 source: "pic/base/Button_BG_460_59.png" } Text{ id: diagCommonSettingGeneral_Instr_backlight x: 9 y: 145 text:"Instr&backlight" font.pixelSize: 30 color: "white" } Base_VolumeBar_10items{ id: diagCommonSettingGeneral_10iteamsVolumeBar_Instr x: 240 y: 145 } Text { id: diagCommonSettingGeneral_Sound x: 9 y: 215 text: "Sound" font.bold: true font.pixelSize: 30 color: "#ce0052" } Base_Button_Have_Arrow{ id: diagCommonSettingGeneral_Speed_sens_vol x: 9 y: 261 base_Arrow_Button_20_pixel_Text_Name_Right: "Medium" base_Arrow_Button_Name:"Speed sensitive vol." } Text { id: diagCommonSettingGeneral_System x: 9 y: 345 text: "System" font.pixelSize: 30 color: "#ce0052" font.bold: true } Base_Button_Have_Arrow{ id: diagCommonSettingGeneral_Button_MapInfo x: 9 y : 391 base_Arrow_Button_Name: "Map info" } Base_Diag_General_White_Button_MMCReset{ id: diagCommonSettingGeneral_FacResetMMC x: 9 y: 460 } Base_Diag_General_White_Button_CarReset{ id: diagCommonSettingGeneral_FacResetCar x: 9 y: 530 } }
}@
Base_Button_Have_Arrow.qml
@import QtQuick 1.1Item {
id: base_Button_Have_Arrow
width: 460
height: 60
property string base_Arrow_Button_Name
property string base_Arrow_Button_20_pixel_Text_Name_Right: ""
property string base_Arrow_Button_20_pixel_Text_Name_Middle:""
property int i_whichone: 0
signal bechecked(int i_whichone)Image{ id: base_Arrow_Button_BG width: parent.width height: 59 source: "pic/base/Button_BG_460_59.png" } Image { id: base_Arrow_Button_BG_List_01 x:0 y:0 width: parent.width height: 1 source: "pic/base/ButtonListUnPressed.png" } Image { id: base_Arrow_Button_BG_List_02 x : 0 y : 59 width: parent.width height: 1 source: "pic/base/ButtonListUnPressed.png" } Text { id: base_Arrow_Button_Text x: 10 y: 14 font.pixelSize:30 text: base_Arrow_Button_Name color: "white" } Image { id: base_Arrow_Button_Arrow x: 410 y: 0 width: 60 height: 59 source: "pic/base/ico_gen_ListArrow_30_b.png" } Text{ id:base_Arrow_Button_20pixelText_Right x: 340 y: 19 font.pixelSize: 20 text: base_Arrow_Button_20_pixel_Text_Name_Right color: "white" } Text{ id:base_Arrow_Button_20pixel_Text_Name_Middle x: 200 y: 19 font.pixelSize: 20 text: base_Arrow_Button_20_pixel_Text_Name_Middle color:"white" } MouseArea{ id:mouse_area_arrow anchors.fill: parent onPressed: { base_Arrow_Button_BG.source = "pic/base/Button_BG_Pushed.png" base_Arrow_Button_BG_List_01.source = "pic/base/Base_List.bmp" base_Arrow_Button_BG_List_02.source = "pic/base/Base_List.bmp" base_Arrow_Button_Text.color = "#ce0052" base_Arrow_Button_20pixelText_Right.color = "#ce0052" base_Arrow_Button_20pixel_Text_Name_Middle.color = "#ce0052" base_Arrow_Button_Arrow.source = "pic/base/ico_gen_ListArrow_30_bg.png" } onReleased: { base_Arrow_Button_BG.source = "pic/base/Button_BG_460_59.png" base_Arrow_Button_BG_List_01.source = "pic/base/ButtonListUnPressed.png" base_Arrow_Button_BG_List_02.source = "pic/base/ButtonListUnPressed.png" base_Arrow_Button_Text.color = "white" base_Arrow_Button_20pixelText_Right.color = "white" base_Arrow_Button_20pixel_Text_Name_Middle.color = "white" base_Arrow_Button_Arrow.source = "pic/base/ico_gen_ListArrow_30_b.png" base_Button_Have_Arrow.bechecked(i_whichone) } hoverEnabled: true }
}
@
-
Those two posts contain the same source code, just a side note.
Concerning your issue, you need to disable your inner "MouseArea":http://harmattan-dev.nokia.com/docs/library/html/qt4/qml-mousearea.html, not make it invisible. Use "enabled":http://harmattan-dev.nokia.com/docs/library/html/qt4/qml-mousearea.html#enabled-prop property.
-
OK! Thank you!!!
I get off work, so I'll try tonight.
Have a nice day ! -
Question be solved,a ha...