Add focus and key events handling on Buttton plasma component

- When a button is clicked it aqcuires the focus.
- The space and return keys now can be used to press the button if
  it has the activeFocus

Signed-off-by: Daker Fernandes Pinheiro <dakerfp@gmail.com>
This commit is contained in:
Daker Fernandes Pinheiro 2011-07-15 21:21:06 -03:00
parent 38284f8e1a
commit 83bd875a44
2 changed files with 60 additions and 13 deletions

View File

@ -36,9 +36,45 @@ Item {
// Plasma API
property QtObject theme: PlasmaCore.Theme { }
function pressButton() {
surface.prefix = "pressed";
}
function releaseButton() {
if (button.checkable)
button.checked = !button.checked;
// TODO: "checked" state must have special graphics?
if (button.checked)
surface.prefix = "pressed";
else
surface.prefix = "normal";
button.clicked();
button.forceActiveFocus();
}
width: 50
height: 20
Keys.onSpacePressed: pressButton();
Keys.onReturnPressed: pressButton();
Keys.onReleased: {
if (event.key == Qt.Key_Space ||
event.key == Qt.Key_Return)
releaseButton();
}
onActiveFocusChanged: {
if (activeFocus) {
shadow.opacity = 0;
hover.opacity = 1;
}else {
shadow.opacity = 1;
hover.opacity = 0;
}
}
PlasmaCore.FrameSvgItem {
id: hover
@ -125,27 +161,23 @@ Item {
hoverEnabled: true
onPressed: {
surface.prefix = "pressed";
pressButton();
}
onReleased: {
if (button.checkable)
button.checked = !button.checked;
// TODO: "checked" state must have special graphics?
if (button.checked)
surface.prefix = "pressed";
else
surface.prefix = "normal";
button.clicked();
releaseButton();
}
onEntered: {
shadow.opacity = 0;
hover.opacity = 1;
}
onExited: {
shadow.opacity = 1;
hover.opacity = 0;
if (button.activeFocus) {
shadow.opacity = 0;
hover.opacity = 1;
} else {
shadow.opacity = 1;
hover.opacity = 0;
}
}
}
}

View File

@ -29,6 +29,7 @@ Column {
}
PlasmaComponents.Button {
id: bt1
width: 140
height: 30
text: "Button"
@ -36,9 +37,12 @@ Column {
onClicked: {
console.log("Clicked");
}
Keys.onTabPressed: bt2.forceActiveFocus();
}
PlasmaComponents.Button {
id: bt2
width: 140
height: 30
text: "Checkable Button"
@ -50,9 +54,12 @@ Column {
else
console.log("Button Unchecked");
}
Keys.onTabPressed: bt3.forceActiveFocus();
}
PlasmaComponents.Button {
id: bt3
width: 140
height: 30
text: "Different Font"
@ -60,18 +67,26 @@ Column {
pixelSize: 20
family: "Helvetica"
}
Keys.onTabPressed: bt4.forceActiveFocus();
}
PlasmaComponents.Button {
id: bt4
width: 140
height: 30
text: "Icon Button"
iconSource: "/home/dakerfp/work/comics-reader/ui/images/random.png"
Keys.onTabPressed: bt5.forceActiveFocus();
}
PlasmaComponents.Button {
id: bt5
width: 140
height: 30
iconSource: "/home/dakerfp/work/comics-reader/ui/images/random.png"
Keys.onTabPressed: bt1.forceActiveFocus();
}
}