[ListViewItemWithActions] Simplicity of actions delegate

examples/touch/content/ListViewPage.qml

@@ -43,23 +43,12 @@ Page {
             width: parent.width
             height: Theme.itemHeightLarge
 
-            actions: Rectangle{
-                id: itemActions
-                height: Theme.itemHeightLarge
-                width: height
-
-                color: "transparent"
-
-                Image{
-                    id: removeButton
-                    width: parent.width*0.6
-                    height: width
-
-                    source: "image://theme/times"
-
-                    anchors.centerIn: parent
+            actions:[
+                ActionButton {
+                    iconSource: "image://theme/times"
                 }
-            }
+
+            ]
         }
         section.property: "size"
     }

src/controls/controls.pro

@@ -9,6 +9,7 @@ THEME_IMPORT_PATH = QtQuick/Controls/Styles/Nemo/themes
 QML_FILES += \
     qml/Button.qml \
     qml/ApplicationWindow.qml \
+    qml/ActionButton.qml \
     qml/Page.qml \
     qml/Spinner.qml \
     qml/Label.qml \

src/controls/qml/ActionButton.qml

+/****************************************************************************************
+**
+** Copyright (C) 2019 Chupligin Sergey <neochapay@gmail.com>
+** All rights reserved.
+**
+** You may use this file under the terms of BSD license as follows:
+**
+** Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are met:
+**     * Redistributions of source code must retain the above copyright
+**       notice, this list of conditions and the following disclaimer.
+**     * Redistributions in binary form must reproduce the above copyright
+**       notice, this list of conditions and the following disclaimer in the
+**       documentation and/or other materials provided with the distribution.
+**     * Neither the name of the author nor the
+**       names of its contributors may be used to endorse or promote products
+**       derived from this software without specific prior written permission.
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
+** ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+** WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+** DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDERS OR CONTRIBUTORS BE LIABLE FOR
+** ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
+** (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+** LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
+** ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+** SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+**
+****************************************************************************************/
+import QtQuick 2.6
+
+Item {
+    id: actionButton
+
+    property alias iconSource: actionButtonImage.source
+
+    signal clicked();
+
+    height: parent.height
+    width: parent.width
+
+    Image{
+        id: actionButtonImage
+        width: parent.height*0.6
+        height: width
+
+        anchors.centerIn: parent
+
+        MouseArea{
+            anchors.fill: parent
+            onClicked: actionButton.clicked()
+        }
+    }
+}

src/controls/qml/ListViewItemWithActions.qml

@@ -50,7 +50,7 @@ Item {
 
     property bool showActions: true
 
-    property alias actions: actionsLoader.sourceComponent
+    property list<Item> actions
 
     signal clicked
 
@@ -74,10 +74,20 @@ Item {
         anchors.right: listArea.left
 
         height: listArea.height
-        width: childrenRect.width
+        width: height*actions.length
 
-        Loader {
-            id: actionsLoader
+        Row {
+            id: actionsRow
+            width: actionsArea.width
+            height: actionsArea.height
+
+            children: actions
+        }
+
+        Component.onCompleted: {
+            if(actions.length > 3) {
+                console.warn("Use more 3 actions is not good idea!")
+            }
         }
     }
 
@@ -96,7 +106,7 @@ Item {
             height: parent.height
             width: Theme.itemSpacingSmall/4-Theme.itemSpacingSmall/4*listArea.x/actionsArea.width
             color: Theme.accentColor
-            visible: (actionsLoader.item && showActions)
+            visible: (height*actions.length > 0 && showActions)
         }
 
         Rectangle {
@@ -233,7 +243,7 @@ Item {
             }
 
             onPressAndHold: {
-                if (actionsLoader.item && showActions) {
+                if (actions.length > 0 && showActions) {
                     listArea.x = actionsArea.width
                 }
             }

src/controls/qml/qmldir

@@ -30,6 +30,7 @@ TimePicker 1.0 TimePicker.qml
 ScrollDecorator 1.0 ScrollDecorator.qml
 TextField 1.0 TextField.qml
 ProgressBar 1.0 ProgressBar.qml
+ActionButton 1.0 ActionButton.qml
 
 # MIRRORED CONTROLS: 
 # These are the controls that we take directly from official QQC.