Add TextArea plasma component
The TextArea is defined in the Qt Components common API.
Some features were added as a plasma specific behaviour for this component:
- It emit the keys pressed and released signals
- Implements a focus policy
- The current implementation only covers the desktop use case.
For mobile use, a flickable text area with scroll decorators
would be more appropriate.
- Scroll bars appears only if the content is bigger than the content.
- The width of the the scroll bars can be setted through the scrollWidth
property
- The size of the text content can also be setted. For this the properties
contentMaxWidth and contentMaxHeight must be used. The default value
is the dimensions of the TextArea.
The current state of the implemention lacks of:
- A behaviour for hover state, present in other components
- A errorHighlight usage
- Polish the visual alignment of the SVGs items
- Lacks of right mouse button interaction.
Would be interesting to use it to cut & paste operations.
Signed-off-by: Daker Fernandes Pinheiro <dakerfp@gmail.com>
This commit is contained in:
Daker Fernandes Pinheiro
parent
d318641dcf
commit
decbcb0439
220
declarativeimports/plasmacomponents/TextArea.qml
Normal file
220
declarativeimports/plasmacomponents/TextArea.qml
Normal file
@ -0,0 +1,220 @@
|
||||
/*
|
||||
* Copyright (C) 2011 by Daker Fernandes Pinheiro <dakerfp@gmail.com>
|
||||
*
|
||||
* This program is free software; you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Library General Public License as
|
||||
* published by the Free Software Foundation; either version 2, or
|
||||
* (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU General Public License for more details
|
||||
*
|
||||
* You should have received a copy of the GNU Library General Public
|
||||
* License along with this program; if not, write to the
|
||||
* Free Software Foundation, Inc.,
|
||||
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||||
*/
|
||||
|
||||
import QtQuick 1.1
|
||||
import org.kde.plasma.core 0.1 as PlasmaCore
|
||||
|
||||
Item {
|
||||
id: textArea
|
||||
|
||||
// Common API
|
||||
property alias font: textEdit.font // alias to textEdit.font
|
||||
property int inputMethodHints
|
||||
property bool errorHighlight
|
||||
property alias cursorPosition: textEdit.cursorPosition
|
||||
property alias horizontalAlignment: textEdit.cursorPosition
|
||||
property alias verticalAlignment: textEdit.cursorPosition
|
||||
property alias readOnly: textEdit.readOnly
|
||||
property alias selectedText: textEdit.selectedText // read-only
|
||||
property alias selectionEnd: textEdit.selectionEnd // read-only
|
||||
property alias selectionStart: textEdit.selectionStart // read-only
|
||||
property alias text: textEdit.text
|
||||
property alias textFormat: textEdit.textFormat // enumeration
|
||||
property alias wrapMode: textEdit.wrapMode // enumeration
|
||||
property string placeholderText
|
||||
|
||||
// functions
|
||||
function copy() {
|
||||
textEdit.copy();
|
||||
}
|
||||
|
||||
function paste() {
|
||||
textEdit.paste();
|
||||
}
|
||||
|
||||
function cut() {
|
||||
textEdit.cut();
|
||||
}
|
||||
|
||||
function select(start, end) {
|
||||
textEdit.select(start, end);
|
||||
}
|
||||
|
||||
function selectAll() {
|
||||
textEdit.selectAll();
|
||||
}
|
||||
|
||||
function selectWord() {
|
||||
textEdit.selectWord();
|
||||
}
|
||||
|
||||
function positionAt(pos) {
|
||||
textEdit.positionAt(pos);
|
||||
}
|
||||
|
||||
function positionToRectangle(pos) {
|
||||
textEdit.positionToRectangle(pos);
|
||||
}
|
||||
|
||||
// Plasma API
|
||||
property alias interactive: flickArea.interactive
|
||||
property alias contentMaxWidth: textEdit.width
|
||||
property alias contentMaxHeight: textEdit.height
|
||||
property real scrollWidth: 22
|
||||
|
||||
// Set active focus to it's internal textInput.
|
||||
// Overriding QtQuick.Item forceActiveFocus function.
|
||||
function forceActiveFocus() {
|
||||
textEdit.forceActiveFocus();
|
||||
}
|
||||
|
||||
// Overriding QtQuick.Item activeFocus property.
|
||||
property alias activeFocus: textEdit.activeFocus
|
||||
|
||||
opacity: enabled ? 1.0 : 0.5
|
||||
|
||||
PlasmaCore.FrameSvgItem {
|
||||
id: base
|
||||
|
||||
// TODO: see what is the best policy for margins
|
||||
anchors {
|
||||
fill: flickArea
|
||||
leftMargin: -2 * base.margins.left
|
||||
rightMargin: -2 * base.margins.right
|
||||
topMargin: -2 * base.margins.top
|
||||
bottomMargin: -2 * base.margins.bottom
|
||||
}
|
||||
imagePath: "widgets/lineedit"
|
||||
prefix: "base"
|
||||
|
||||
PlasmaCore.FrameSvgItem {
|
||||
id: hover
|
||||
|
||||
anchors {
|
||||
fill: parent
|
||||
leftMargin: -margins.left
|
||||
topMargin: -margins.top
|
||||
rightMargin: -margins.right
|
||||
bottomMargin: -margins.bottom
|
||||
}
|
||||
imagePath: "widgets/lineedit"
|
||||
prefix: {
|
||||
// XXX: missing hover state
|
||||
if (textEdit.activeFocus)
|
||||
return "focus";
|
||||
else
|
||||
return "";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Flickable {
|
||||
id: flickArea
|
||||
anchors {
|
||||
fill: parent
|
||||
rightMargin: scrollWidth
|
||||
bottomMargin: scrollWidth
|
||||
}
|
||||
interactive: false //textArea.activeFocus
|
||||
contentWidth: {
|
||||
if (textEdit.wrapMode == TextEdit.NoWrap)
|
||||
return textEdit.paintedWidth;
|
||||
|
||||
return Math.min(textEdit.paintedWidth, textEdit.width);
|
||||
}
|
||||
contentHeight: Math.min(textEdit.paintedHeight, textEdit.height)
|
||||
clip: true
|
||||
|
||||
TextEdit {
|
||||
id: textEdit
|
||||
|
||||
width: flickArea.width
|
||||
height: flickArea.height
|
||||
clip: true
|
||||
wrapMode: TextEdit.Wrap
|
||||
enabled: textArea.enabled
|
||||
|
||||
onCursorPositionChanged: {
|
||||
if (cursorRectangle.x < flickArea.contentX) {
|
||||
flickArea.contentX = cursorRectangle.x;
|
||||
return;
|
||||
}
|
||||
|
||||
if (cursorRectangle.x > flickArea.contentX +
|
||||
flickArea.width - cursorRectangle.width) {
|
||||
flickArea.contentX = cursorRectangle.x -
|
||||
cursorRectangle.width;
|
||||
return;
|
||||
}
|
||||
|
||||
if (cursorRectangle.y < flickArea.contentY) {
|
||||
flickArea.contentY = cursorRectangle.y;
|
||||
return;
|
||||
}
|
||||
|
||||
if (cursorRectangle.y > flickArea.contentY +
|
||||
flickArea.height - cursorRectangle.height) {
|
||||
flickArea.contentY = cursorRectangle.y -
|
||||
cursorRectangle.height;
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// Proxying keys events is not required by the
|
||||
// common API but is desired in the plasma API.
|
||||
Keys.onPressed: textArea.Keys.pressed(event);
|
||||
Keys.onReleased: textArea.Keys.released(event);
|
||||
|
||||
Text {
|
||||
anchors.fill: parent
|
||||
text: textArea.placeholderText
|
||||
visible: textEdit.text == "" && !textArea.activeFocus
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ScrollBar {
|
||||
id: horizontalScroll
|
||||
anchors {
|
||||
bottom: parent.bottom
|
||||
left: parent.left
|
||||
right: flickArea.right
|
||||
}
|
||||
enabled: parent.enabled
|
||||
flickableItem: flickArea
|
||||
height: visible ? scrollWidth : 0
|
||||
orientation: Qt.Horizontal
|
||||
stepSize: textEdit.font.pixelSize
|
||||
}
|
||||
|
||||
ScrollBar {
|
||||
id: verticalScroll
|
||||
anchors {
|
||||
right: parent.right
|
||||
top: parent.top
|
||||
bottom: flickArea.bottom
|
||||
}
|
||||
enabled: parent.enabled
|
||||
flickableItem: flickArea
|
||||
width: visible ? scrollWidth : 0
|
||||
orientation: Qt.Vertical
|
||||
stepSize: textEdit.font.pixelSize
|
||||
}
|
||||
}
|
||||
@ -16,4 +16,5 @@ ScrollDecorator 0.1 ScrollDecorator.qml
|
||||
Slider 0.1 Slider.qml
|
||||
Switch 0.1 Switch.qml
|
||||
TextField 0.1 TextField.qml
|
||||
TextArea 0.1 TextArea.qml
|
||||
ToolButton 0.1 ToolButton.qml
|
||||
|
||||
Loading…
Reference in New Issue
Block a user