Merge lp:~zsombi/ubuntu-ui-toolkit/79-more-simplification into lp:ubuntu-ui-toolkit/staging

[Zsombor Egri]

Second stage of simplification - divider group property is an item, simplifying the anchoring of the contentItem. PropertyChange does not backup the property binding, uses QQmlPropertyPrivate::write() with parameter to keep bindings. ListItemAnimator uses behavior to animate snapping. Styling got "styledItem" context property to obey general styling rules. clicked() and pressAndHold() emission fix when content is swiped.

[Zsombor Egri (zsombi)]

More simplification in an upcoming MR.

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1418
http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1419/
Executed test runs:
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/1211
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-amd64-ci/146
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-armhf-ci/149
        deb: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-armhf-ci/149/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-i386-ci/146
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/1071
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1209
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1209/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/17840

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1419/rebuild

review: Needs Fixing (continuous-integration)

[Tim Peeters (tpeeters)]

52 + // anchor to the top of the item but to the bottom of the contentItem, so we do not draw over the divider
53 + top: styledItem.top
54 + bottom: styledItem.contentItem.bottom
55 + bottomMargin: -styledItem.contentItem.anchors.bottomMargin

Why does the panel need to take the bottomMargin of the contentItem into account? If the contents of the listitem has a bottom margin, the panel should still cover the whole contentItem

review: Needs Information

[Tim Peeters (tpeeters)]

56 + // adjust margins
57 + leftMargin: leading ? 0 : styledItem.contentItem.anchors.rightMargin
58 + rightMargin: leading ? styledItem.contentItem.anchors.leftMargin : 0

what does this do? I don't understand why the left/right margins are needed here

[Tim Peeters (tpeeters)]

66 - leftMargin: (leading && panel.ListItem.item) ? -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
67 - rightMargin: (!leading && panel.ListItem.item) ? -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
68 + leftMargin: (leading && styledItem) ? -units.gu(4 * styledItem.swipeOvershoot) : 0
69 + rightMargin: (!leading && styledItem) ? -units.gu(4 * styledItem.swipeOvershoot) : 0

Is the swipeOvershoot defined in grid units?
The docs don't say that:

/*!
 * \qmlproperty real ListItem::swipeOvershoot
 * The property configures the overshoot value on swiping. Its default value is
 * configured by the \l {ListItemStyle}{style}. Any positive value overrides the
 * default value, and any negative or undefined value resets it back to the default.
 */

So I'd rather have it in pixels. You can still set it like swipeOvershoot: units.gu(2) then.

Also, why is it multiplied by 4 here?

review: Needs Information

[Tim Peeters (tpeeters)]

253 -UCListItemSnapAnimator::UCListItemSnapAnimator(UCListItem *item)
254 - : QObject(item)
255 - , item(item)
256 +ListItemAnimator::ListItemAnimator(QObject *parent)
257 + : QObject(parent)
258 + , activeAnimations(0)
259 + , item(0)

why did you rename this class?

[Tim Peeters (tpeeters)]

105 + snapAnimation: UbuntuNumberAnimation {
106 + duration: UbuntuAnimation.SnapDuration
107 }

I would prefer a velocity instead of a duration (or a duration depending on the number of pixels it needs to move). As it is now, when you release really close to the end-state (so not much to animate), the animation appears quite slow.

But, this is something to discuss with design, and, if we change it, to implement in a separate MR.

[Tim Peeters (tpeeters)]

506 +class UCListItemDividerPrivate : public QQuickItemPrivate

why inherit from QQuickItemPrivate and not QQuickItem?

review: Needs Information

[Tim Peeters (tpeeters)]

803 + // udpate divider

typo

and maybe this commend doesn't add information that is not clear from the code

804 + divider->setImplicitHeight(UCUnits::instance().dp(DIVIDER_THICKNESS_DP));

[Tim Peeters (tpeeters)]

1017 + * ListItem's bottom in case teh divider is not visible. The content is clipped

your favorite typo :)

[Tim Peeters (tpeeters)]

1020 + * An example where 2 grid units on left and right, as well as 0.5 grid units
1021 + * top and bottom margins are required:
1022 + * \qml
1023 + * import QtQuick 2.3
1024 + * import Ubuntu.Components 1.2
1025 + *
1026 + * ListItem {
1027 + * contentItem.anchors {
1028 + * leftMargin: units.gu(2)
1029 + * rightMargin: units.gu(2)
1030 + * topMargin: units.gu(0.5)
1031 + * bottomMargin: units.gu(0.5)
1032 + * }
1033 + * }
1034 + * \endqml

Just a little detail (maybe a matter of taste): I would replace the introduction sentence on l.1020,1021 by: "Example: ". The rest is clear enough from the code.

Do we have guidelines when to include the "import" statements? On a previous MR we decided not to include them for code snippets.

[Tim Peeters (tpeeters)]

1055 + * the starting and ending colors of the divider. Beside thes properties all Item
1056 + * specific properties can be accessed.

*thes

[Tim Peeters (tpeeters)]

1569 + function test_verify_no_click_when_swiped() {
1583 + function test_verify_no_pressAndHold_when_swiped() {

I prefer as function names: test_no_click_when_swiped() and test_no_pressAndHold_when_swiped(). All tests are there to verify something.

[Tim Peeters (tpeeters)]

1621 + TestExtras.touchRelease(0, listItem, Qt.point(listItem.width / 2, dy));
1622 + wait(400);

Instead of wait(400), can we wait for contentMoving to become false?

[Tim Peeters (tpeeters)]

1745 + wait(200)

Again, can we wait for contentMoving == false instead?

Also missing semicolon.

[Zsombor Egri (zsombi)]

> 52 + // anchor to the top of the item but to the bottom of the
> contentItem, so we do not draw over the divider
> 53 + top: styledItem.top
> 54 + bottom: styledItem.contentItem.bottom
> 55 + bottomMargin: -styledItem.contentItem.anchors.bottomMargin
>
>
> Why does the panel need to take the bottomMargin of the contentItem into
> account? If the contents of the listitem has a bottom margin, the panel should
> still cover the whole contentItem

Exactly, that's why is taken with negative value, so the panel covers the area till the divider. I cannot anchor to the divider because it is not a sibling, so I had to do it this way.

[Zsombor Egri (zsombi)]

> 56 + // adjust margins
> 57 + leftMargin: leading ? 0 :
> styledItem.contentItem.anchors.rightMargin
> 58 + rightMargin: leading ?
> styledItem.contentItem.anchors.leftMargin : 0
>
> what does this do? I don't understand why the left/right margins are needed
> here

This makes sure the panel takes into account the margins of the contentItem, so when you swipe, the panel won't jump in to the edge of the contentItem, but will be swiped in like it would be "glued" to the edge of the ListItem.

From this MR on, the ListItem.contentItem.anchors.margins alteration is allowed.

[Zsombor Egri (zsombi)]

> 66 - leftMargin: (leading && panel.ListItem.item) ?
> -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
> 67 - rightMargin: (!leading && panel.ListItem.item) ?
> -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
> 68 + leftMargin: (leading && styledItem) ? -units.gu(4 *
> styledItem.swipeOvershoot) : 0
> 69 + rightMargin: (!leading && styledItem) ? -units.gu(4 *
> styledItem.swipeOvershoot) : 0
>
>
> Is the swipeOvershoot defined in grid units?
> The docs don't say that:
>
> /*!
> * \qmlproperty real ListItem::swipeOvershoot
> * The property configures the overshoot value on swiping. Its default value
> is
> * configured by the \l {ListItemStyle}{style}. Any positive value overrides
> the
> * default value, and any negative or undefined value resets it back to the
> default.
> */
>
> So I'd rather have it in pixels. You can still set it like swipeOvershoot:
> units.gu(2) then.
>
> Also, why is it multiplied by 4 here?

Yeah, it supposed to be in pixels, but tbh, this whole overshooting did not work ever properly. It'll be removed completely, like the whole ListItemPanel.qml in the next MR. The multiplication was needed to be able to cover the area on the eventual spring animation bouncing, when the panel was too short and the background of the ListItem got visible :/

So, no more overshoot in the next MR, should we still bother fixing this?

[Zsombor Egri (zsombi)]

> 253 -UCListItemSnapAnimator::UCListItemSnapAnimator(UCListItem *item)
> 254 - : QObject(item)
> 255 - , item(item)
> 256 +ListItemAnimator::ListItemAnimator(QObject *parent)
> 257 + : QObject(parent)
> 258 + , activeAnimations(0)
> 259 + , item(0)
>
> why did you rename this class?

I was thinking that I should use this class for something other than just snapping animator, to control the animations for selection, drag panel and expand/collapse. But then I realised that there is too much functionality is hardcoded in the ListItem, so I stopped doing that. But then reverting it would have been a pain, so I stabilised it and saved it as is. It'll disappear in the next MR as well.

[Zsombor Egri (zsombi)]

> 105 + snapAnimation: UbuntuNumberAnimation {
> 106 + duration: UbuntuAnimation.SnapDuration
> 107 }
>
> I would prefer a velocity instead of a duration (or a duration depending on
> the number of pixels it needs to move). As it is now, when you release really
> close to the end-state (so not much to animate), the animation appears quite
> slow.
>
> But, this is something to discuss with design, and, if we change it, to
> implement in a separate MR.

Uhm, I don't get what you want here. Animations don't have velocity property, maybe you want to upstream that :)

But yes, if you release close to the end, that is what it happens. Easing curves are the ones which can speed up when reaching the target position, and we must tweak it to get a decent behaviour. Will also suffer changes in the 79b MR.

[Zsombor Egri (zsombi)]

> 506 +class UCListItemDividerPrivate : public QQuickItemPrivate
>
> why inherit from QQuickItemPrivate and not QQuickItem?

Well, if you see this is the private API of the UCListItemDivider. As UCListItemDivider is derived from QQuickItem, it is recommended that its private also derives from QQuickItemPrivate to avoid duplicity of the d-pointers. In this way the UCListItem will have only one d_func() or d-pointer.

[Zsombor Egri (zsombi)]

> 803 + // udpate divider
>
> typo
>
> and maybe this commend doesn't add information that is not clear from the code
>
> 804 +
> divider->setImplicitHeight(UCUnits::instance().dp(DIVIDER_THICKNESS_DP));

Fixed.

[Zsombor Egri (zsombi)]

> 1017 + * ListItem's bottom in case teh divider is not visible. The content
> is clipped
>
> your favorite typo :)

Haha, you love it ;) Fixed.

[Zsombor Egri (zsombi)]

> 1020 + * An example where 2 grid units on left and right, as well as 0.5
> grid units
> 1021 + * top and bottom margins are required:
> 1022 + * \qml
> 1023 + * import QtQuick 2.3
> 1024 + * import Ubuntu.Components 1.2
> 1025 + *
> 1026 + * ListItem {
> 1027 + * contentItem.anchors {
> 1028 + * leftMargin: units.gu(2)
> 1029 + * rightMargin: units.gu(2)
> 1030 + * topMargin: units.gu(0.5)
> 1031 + * bottomMargin: units.gu(0.5)
> 1032 + * }
> 1033 + * }
> 1034 + * \endqml
>
> Just a little detail (maybe a matter of taste): I would replace the
> introduction sentence on l.1020,1021 by: "Example: ". The rest is clear enough
> from the code.

Ok, removed.
>
> Do we have guidelines when to include the "import" statements? On a previous
> MR we decided not to include them for code snippets.

Wherever there's a need to provide full examples, we do. In case a detail is explained like different usages or flags to be explained, we can have snippets. These can be either replacements on the topmost documentation's example (if one example is provided), or simple insertable code in an existing application. That's how Qt docs are made as well.

[Zsombor Egri (zsombi)]

> 1055 + * the starting and ending colors of the divider. Beside thes
> properties all Item
> 1056 + * specific properties can be accessed.
>
> *thes

Fixed.

[Zsombor Egri (zsombi)]

> 1569 + function test_verify_no_click_when_swiped() {
> 1583 + function test_verify_no_pressAndHold_when_swiped() {
>
> I prefer as function names: test_no_click_when_swiped() and
> test_no_pressAndHold_when_swiped(). All tests are there to verify something.

Right. I think at some point the test was failing if it wasn't executed at the end of the tests, I guess because of some leftovers of the other tests...

[Zsombor Egri (zsombi)]

> 1621 + TestExtras.touchRelease(0, listItem,
> Qt.point(listItem.width / 2, dy));
> 1622 + wait(400);
>
> Instead of wait(400), can we wait for contentMoving to become false?

This wait is not for that. It is to avoid double-click event to be triggered in the next tests. There's even a comment about that.

[Zsombor Egri (zsombi)]

> 1745 + wait(200)
>
> Again, can we wait for contentMoving == false instead?
>
> Also missing semicolon.

That is a leftover from a debugging. It is not needed.

[lp:~zsombi/ubuntu-ui-toolkit/79-more-simplification]

1419. By Zsombor Egri on 2015-02-10

review comments applied

1420. By Zsombor Egri on 2015-02-10

staging merge

[PS Jenkins bot (ps-jenkins)]

PASSED: Continuous integration, rev:1420
http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1427/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/1265
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-amd64-ci/154
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-armhf-ci/157
        deb: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-armhf-ci/157/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-vivid-i386-ci/154
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/1118
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1263
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1263/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/17918

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/ubuntu-sdk-team-ubuntu-ui-toolkit-staging-ci/1427/rebuild

review: Approve (continuous-integration)

[Tim Peeters (tpeeters)]

> > 66 - leftMargin: (leading && panel.ListItem.item) ?
> > -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
> > 67 - rightMargin: (!leading && panel.ListItem.item) ?
> > -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
> > 68 + leftMargin: (leading && styledItem) ? -units.gu(4 *
> > styledItem.swipeOvershoot) : 0
> > 69 + rightMargin: (!leading && styledItem) ? -units.gu(4 *
> > styledItem.swipeOvershoot) : 0
> >
> >
> > Is the swipeOvershoot defined in grid units?
> > The docs don't say that:
> >
> > /*!
> > * \qmlproperty real ListItem::swipeOvershoot
> > * The property configures the overshoot value on swiping. Its default value
> > is
> > * configured by the \l {ListItemStyle}{style}. Any positive value overrides
> > the
> > * default value, and any negative or undefined value resets it back to the
> > default.
> > */
> >
> > So I'd rather have it in pixels. You can still set it like swipeOvershoot:
> > units.gu(2) then.
> >
> > Also, why is it multiplied by 4 here?
>
> Yeah, it supposed to be in pixels, but tbh, this whole overshooting did not
> work ever properly. It'll be removed completely, like the whole
> ListItemPanel.qml in the next MR. The multiplication was needed to be able to
> cover the area on the eventual spring animation bouncing, when the panel was
> too short and the background of the ListItem got visible :/
>
> So, no more overshoot in the next MR, should we still bother fixing this?

No need to spend time on fixing something that will be removed tomorrow :)

[Tim Peeters (tpeeters)]

> > 105 + snapAnimation: UbuntuNumberAnimation {
> > 106 + duration: UbuntuAnimation.SnapDuration
> > 107 }
> >
> > I would prefer a velocity instead of a duration (or a duration depending on
> > the number of pixels it needs to move). As it is now, when you release
> really
> > close to the end-state (so not much to animate), the animation appears quite
> > slow.
> >
> > But, this is something to discuss with design, and, if we change it, to
> > implement in a separate MR.
>
> Uhm, I don't get what you want here. Animations don't have velocity property,
> maybe you want to upstream that :)
>
> But yes, if you release close to the end, that is what it happens. Easing
> curves are the ones which can speed up when reaching the target position, and
> we must tweak it to get a decent behaviour. Will also suffer changes in the
> 79b MR.

Some animations have a velocity property, like http://doc-snapshot.qt-project.org/qt5-5.4/qml-qtquick-smoothedanimation.html

But yeah I get the problem. An option would be set the speed as a function of the distance when the mouse is released.

[Tim Peeters (tpeeters)]

> > 506 +class UCListItemDividerPrivate : public QQuickItemPrivate
> >
> > why inherit from QQuickItemPrivate and not QQuickItem?
>
> Well, if you see this is the private API of the UCListItemDivider. As
> UCListItemDivider is derived from QQuickItem, it is recommended that its
> private also derives from QQuickItemPrivate to avoid duplicity of the
> d-pointers. In this way the UCListItem will have only one d_func() or
> d-pointer.

Where did you find that recommendation? It is weird, especially because http://code.woboq.org/qt5/qtdeclarative/src/quick/items/qquickitem_p.h.html contains this:

37 //
38 // W A R N I N G
39 // -------------
40 //
41 // This file is not part of the Qt API. It exists purely as an
42 // implementation detail. This header file may change from version to
43 // version without notice, or even be removed.
44 //
45 // We mean it.
46 //

[Zsombor Egri (zsombi)]

> > > 506 +class UCListItemDividerPrivate : public QQuickItemPrivate
> > >
> > > why inherit from QQuickItemPrivate and not QQuickItem?
> >
> > Well, if you see this is the private API of the UCListItemDivider. As
> > UCListItemDivider is derived from QQuickItem, it is recommended that its
> > private also derives from QQuickItemPrivate to avoid duplicity of the
> > d-pointers. In this way the UCListItem will have only one d_func() or
> > d-pointer.
>
>
> Where did you find that recommendation? It is weird, especially because
> http://code.woboq.org/qt5/qtdeclarative/src/quick/items/qquickitem_p.h.html
> contains this:
>
> 37 //
> 38 // W A R N I N G
> 39 // -------------
> 40 //
> 41 // This file is not part of the Qt API. It exists purely as an
> 42 // implementation detail. This header file may change from version to
> 43 // version without notice, or even be removed.
> 44 //
> 45 // We mean it.
> 46 //

Yes, true, the same is written into every private header. And we have to be prepared for that as well. And as we need to use plenty of privates, this is something we have to live with.

[Tim Peeters (tpeeters)]

okay

review: Approve

=== modified file 'components.api'
--- components.api	2015-02-06 11:49:35 +0000
+++ components.api	2015-02-10 13:46:20 +0000
@@ -888,17 +888,13 @@
     prototype: "QObject"
     Property { name: "actions"; type: "UCListItemActions"; isReadonly: true; isPointer: true }
     Property { name: "visibleActions"; type: "UCAction"; isList: true; isReadonly: true }
-    Property { name: "item"; type: "UCListItem"; isReadonly: true; isPointer: true }
     Property { name: "index"; type: "int"; isReadonly: true }
     Property { name: "panelStatus"; type: "UCListItem::PanelStatus"; isReadonly: true }
     Method {
     name: "snapToPosition"
     Parameter { name: "position"; type: "double" }
     name: "UCListItemDivider"
-    prototype: "QObject"
-    Property { name: "visible"; type: "bool" }
-    Property { name: "leftMargin"; type: "double" }
-    Property { name: "rightMargin"; type: "double" }
+    prototype: "QQuickItem"
     Property { name: "colorFrom"; type: "QColor" }
     Property { name: "colorTo"; type: "QColor" }
     name: "UCListItemStyle"
@@ -907,7 +903,7 @@
     Property { name: "actionsDelegate"; type: "QQmlComponent"; isPointer: true }
     Property { name: "selectionDelegate"; type: "QQmlComponent"; isPointer: true }
     Property { name: "dragHandlerDelegate"; type: "QQmlComponent"; isPointer: true }
-    Property { name: "snapAnimation"; type: "QQuickPropertyAnimation"; isPointer: true }
+    Property { name: "snapAnimation"; type: "QQuickAbstractAnimation"; isPointer: true }
     Property { name: "swipeOvershoot"; type: "double" }
     name: "UCMouse"
     prototype: "QObject"

=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/ListItemPanel.qml'
--- modules/Ubuntu/Components/Themes/Ambiance/ListItemPanel.qml	2015-01-13 14:41:37 +0000
+++ modules/Ubuntu/Components/Themes/Ambiance/ListItemPanel.qml	2015-02-10 13:46:20 +0000
@@ -53,14 +53,19 @@
       Specifies whether the panel is used to visualize leading or trailing actions.
       */
     readonly property bool leading: ListItem.panelStatus == ListItem.Leading
-    readonly property real swipedOffset: leading ? width + x : ListItem.item.width - x;
-    readonly property bool swiping: ListItem.item.highlighted && ListItem.item.contentMoving
+    readonly property real swipedOffset: leading ? width + x : styledItem.width - x;
+    readonly property bool swiping: styledItem.highlighted && styledItem.contentMoving
 
     anchors {
-        left: leading ? undefined : ListItem.item.contentItem.right
-        right: leading ? ListItem.item.contentItem.left : undefined
-        top: ListItem.item.contentItem.top
-        bottom: ListItem.item.contentItem.bottom
+        left: leading ? undefined : styledItem.contentItem.right
+        right: leading ? styledItem.contentItem.left : undefined
+        // anchor to the top of the item but to the bottom of the contentItem, so we do not draw over the divider
+        top: styledItem.top
+        bottom: styledItem.contentItem.bottom
+        bottomMargin: -styledItem.contentItem.anchors.bottomMargin
+        // adjust margins
+        leftMargin: leading ? 0 : styledItem.contentItem.anchors.rightMargin
+        rightMargin: leading ? styledItem.contentItem.anchors.leftMargin : 0
     }
 
     Rectangle {
@@ -68,15 +73,15 @@
         anchors {
             fill: parent
             // add 4 times the overshoot margins to cover the background when tugged
-            leftMargin: (leading && panel.ListItem.item) ? -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
-            rightMargin: (!leading && panel.ListItem.item) ? -units.gu(4 * panel.ListItem.item.swipeOvershoot) : 0
+            leftMargin: (leading && styledItem) ? -units.gu(4 * styledItem.swipeOvershoot) : 0
+            rightMargin: (!leading && styledItem) ? -units.gu(4 * styledItem.swipeOvershoot) : 0
         }
         color: panel.backgroundColor
     }
 
     // handle action triggering
     Connections {
-        target: panel.ListItem.item
+        target: styledItem
         onContentMovementEnded: {
             if (actionsRow.selectedAction) {
                 actionsRow.selectedAction.trigger(actionsRow.listItemIndex);
@@ -125,7 +130,7 @@
             leftMargin: spacing
         }
 
-        property real maxItemWidth: panel.ListItem.item.width / panel.ListItem.visibleActions.length
+        property real maxItemWidth: styledItem.width / panel.ListItem.visibleActions.length
 
         property Action selectedAction
         property int listItemIndex: -1

=== modified file 'modules/Ubuntu/Components/Themes/Ambiance/ListItemStyle.qml'
--- modules/Ubuntu/Components/Themes/Ambiance/ListItemStyle.qml	2015-01-12 15:44:59 +0000
+++ modules/Ubuntu/Components/Themes/Ambiance/ListItemStyle.qml	2015-02-10 13:46:20 +0000
@@ -23,13 +23,7 @@
     swipeOvershoot: units.gu(2)
     actionsDelegate: ListItemPanel{}
 
-    snapAnimation: PropertyAnimation {
-        property: "x"
-        easing {
-            type: Easing.OutElastic
-            period: 0.5
-        }
-        duration: UbuntuAnimation.BriskDuration
+    snapAnimation: UbuntuNumberAnimation {
+        duration: UbuntuAnimation.SnapDuration
     }
-
 }

=== modified file 'modules/Ubuntu/Components/plugin/propertychange_p.cpp'
--- modules/Ubuntu/Components/plugin/propertychange_p.cpp	2014-11-06 13:53:46 +0000
+++ modules/Ubuntu/Components/plugin/propertychange_p.cpp	2015-02-10 13:46:20 +0000
@@ -25,16 +25,27 @@
  * The class is used to save properties and their bindings while the property is
  * altered temporarily.
  */
-PropertyChange::PropertyChange(QObject *item, const char *property)
-    : m_backedUp(false)
+PropertyChange::PropertyChange(QObject *item, const char *property, bool autoBackup)
+    : backedUp(false)
     , qmlProperty(item, property, qmlContext(item))
 {
+    if (autoBackup) {
+        backup();
+    }
 }
 PropertyChange::~PropertyChange()
 {
     restore(this);
 }
 
+void PropertyChange::backup()
+{
+    if (!backedUp) {
+        backupValue = qmlProperty.read();
+        backedUp = true;
+    }
+}
+
 /*
  * Sets a value to the property. Will back up the original values if it wasn't yet.
  * This function can be called many times, it will not destroy the backed up value/binding.
@@ -44,12 +55,11 @@
     if (!change) {
         return;
     }
-    if (!change->m_backedUp) {
-        change->backup.first = QQmlPropertyPrivate::setBinding(change->qmlProperty, 0);
-        change->backup.second = change->qmlProperty.read();
-        change->m_backedUp = true;
-    }
-    change->qmlProperty.write(value);
+    change->backup();
+    // write using QQmlPropertyPrivate so we can keep the bindings
+    QQmlPropertyPrivate::write(change->qmlProperty,
+                               value,
+                               QQmlPropertyPrivate::BypassInterceptor | QQmlPropertyPrivate::DontRemoveBinding);
 }
 
 /*
@@ -60,17 +70,11 @@
     if (!change) {
         return;
     }
-    if (change->m_backedUp) {
-        // if there was a binding, restore it
-        if (change->backup.first) {
-            QQmlAbstractBinding *prevBinding = QQmlPropertyPrivate::setBinding(change->qmlProperty, change->backup.first);
-            if (prevBinding && prevBinding != change->backup.first) {
-                prevBinding->destroy();
-            }
-        } else {
-            // there was no binding, restore previous value
-            change->qmlProperty.write(change->backup.second);
-        }
-        change->m_backedUp = false;
+    if (change->backedUp) {
+        // write using QQmlPropertyPrivate to keep the bindings
+        QQmlPropertyPrivate::write(change->qmlProperty,
+                                   change->backupValue,
+                                   QQmlPropertyPrivate::BypassInterceptor | QQmlPropertyPrivate::DontRemoveBinding);
+        change->backedUp = false;
     }
 }

=== modified file 'modules/Ubuntu/Components/plugin/propertychange_p.h'
--- modules/Ubuntu/Components/plugin/propertychange_p.h	2014-11-06 13:53:46 +0000
+++ modules/Ubuntu/Components/plugin/propertychange_p.h	2015-02-10 13:46:20 +0000
@@ -21,19 +21,20 @@
 #include <QtCore/QObject>
 #include <QtQml/QQmlProperty>
 
-class QQmlAbstractBinding;
 class PropertyChange
 {
 public:
-    PropertyChange(QObject *item, const char *property);
+    PropertyChange(QObject *item, const char *property, bool autoBackup = false);
     ~PropertyChange();
 
     static void setValue(PropertyChange* change, const QVariant &value);
     static void restore(PropertyChange* change);
 private:
-    bool m_backedUp;
+    bool backedUp;
     QQmlProperty qmlProperty;
-    QPair<QQmlAbstractBinding*, QVariant> backup;
+    QVariant backupValue;
+
+    void backup();
 };
 
 #endif // PROPERTYCHANGE_P_H

=== modified file 'modules/Ubuntu/Components/plugin/ucactionpanel_p.cpp'
--- modules/Ubuntu/Components/plugin/ucactionpanel_p.cpp	2015-01-13 14:46:22 +0000
+++ modules/Ubuntu/Components/plugin/ucactionpanel_p.cpp	2015-02-10 13:46:20 +0000
@@ -55,12 +55,14 @@
         return false;
     }
     if (!panelDelegate->isError()) {
-        QQmlContext *context = new QQmlContext(qmlContext(listItem));
+        // use ListItem's style context to be able to access ther styledItem context property
+        UCListItemPrivate *pListItem = UCListItemPrivate::get(listItem);
+        QQmlContext *parentContext = qmlContext(pListItem->styleItem);
+        QQmlContext *context = new QQmlContext(parentContext, parentContext);
         panelItem = qobject_cast<QQuickItem*>(panelDelegate->beginCreate(context));
         if (!panelItem) {
             qmlInfo(listItem) << UbuntuI18n::tr("Error creating ListItem actions panel");
         } else {
-            context->setParent(panelItem);
             QQml_setParent_noEvent(panelItem, listItem);
             panelItem->setParentItem(listItem);
             // create attached property!

=== modified file 'modules/Ubuntu/Components/plugin/uclistitem.cpp'
--- modules/Ubuntu/Components/plugin/uclistitem.cpp	2015-02-05 14:11:27 +0000
+++ modules/Ubuntu/Components/plugin/uclistitem.cpp	2015-02-10 13:46:20 +0000
@@ -34,6 +34,8 @@
 #include <QtQuick/private/qquickanimation_p.h>
 #include <QtQuick/private/qquickmousearea_p.h>
 #include "uclistitemstyle.h"
+#include <QtQuick/private/qquickbehavior_p.h>
+#include <QtQml/QQmlEngine>
 
 QColor getPaletteColor(const char *profile, const char *color)
 {
@@ -58,13 +60,15 @@
  * x coordinate.
  * The animation is defined by the style.
  */
-UCListItemSnapAnimator::UCListItemSnapAnimator(UCListItem *item)
-    : QObject(item)
-    , item(item)
+ListItemAnimator::ListItemAnimator(QObject *parent)
+    : QObject(parent)
+    , activeAnimations(0)
+    , item(0)
 {
 }
-UCListItemSnapAnimator::~UCListItemSnapAnimator()
+ListItemAnimator::~ListItemAnimator()
 {
+    stop();
     // make sure we cannot animate anymore, for safety
     item = 0;
 }
@@ -74,61 +78,83 @@
  * in "to" parameter. If the position is 0, a snap out will be executed - see
  * snapOut(). In any other cases a snap in action will be performed - see snapIn().
  */
-bool UCListItemSnapAnimator::snap(qreal to)
+bool ListItemAnimator::snap(qreal to)
 {
     if (!item) {
         return false;
     }
     UCListItemPrivate *listItem = UCListItemPrivate::get(item);
-    QQuickPropertyAnimation *snap = getDefaultAnimation();
+    bool doSnapOut = (to == 0.0);
+    activeAnimations |= (doSnapOut ? SnapOutAnimation : SnapInAnimation);
+    // fix snap position, take leftMargin into account!
+    to += QQuickItemPrivate::get(listItem->contentItem)->anchors()->leftMargin();
+    if (to == listItem->contentItem->x()) {
+        // there was no move, so we only do some cleanup
+        completeAnimation();
+        return true;
+    }
+
+    QQuickAbstractAnimation *snap = getSnapBehavior();
+    if (snap) {
+        snap->setAlwaysRunToEnd(false);
+        connect(snap, &QQuickAbstractAnimation::runningChanged,
+                this, &ListItemAnimator::completeAnimation,
+                Qt::DirectConnection);
+    }
+    listItem->setContentMoving(true);
+    if (snapBehavior) {
+        snapBehavior->setEnabled(true);
+        snapBehavior->write(to);
+    }
     if (!snap) {
-        // no animation, so we simply position the component
-        listItem->contentItem->setX(to);
-        // and complete snap logic
-        if (to == 0.0) {
-            snapOut();
-        } else {
-            snapIn();
-        }
-        return false;
-    }
-    snap->setTargetObject(listItem->contentItem);
-    if (to == 0.0) {
-        QObject::connect(snap, &QQuickAbstractAnimation::stopped,
-                         this, &UCListItemSnapAnimator::snapOut);
-    } else {
-        QObject::connect(snap, &QQuickAbstractAnimation::stopped,
-                         this, &UCListItemSnapAnimator::snapIn);
-    }
-    if (snap->properties().isEmpty() && snap->property().isEmpty()) {
-        snap->setProperty("x");
-    }
-    // make sure the animation is not running
-    snap->stop();
-    snap->setFrom(listItem->contentItem->property(snap->property().toLocal8Bit().constData()));
-    snap->setTo(to);
-    snap->setAlwaysRunToEnd(false);
-    listItem->setContentMoving(true);
-    snap->start();
+        // complete, as we don't have animation
+        completeAnimation();
+    }
     return true;
 }
 
-void UCListItemSnapAnimator::stop()
-{
-    QQuickPropertyAnimation *snap = getDefaultAnimation();
-    if (snap && snap->isRunning()) {
-        snap->stop();
-    }
-}
-
 /*
  * The function completes a running snap animation.
  */
-void UCListItemSnapAnimator::complete()
-{
-    QQuickPropertyAnimation *snap = getDefaultAnimation();
-    if (snap && snap->isRunning()) {
-        snap->complete();
+void ListItemAnimator::stop()
+{
+    if (snapBehavior && snapBehavior->enabled()) {
+        QQuickAbstractAnimation *animation = snapBehavior->animation();
+        if (animation) {
+            // set animation to be user controlled temporarily so we can invoke stop()
+            animation->setEnableUserControl();
+            animation->stop();
+            animation->setDisableUserControl();
+        }
+        snapBehavior->setEnabled(false);
+    }
+}
+
+// handles animation completion
+void ListItemAnimator::completeAnimation()
+{
+    QQuickAbstractAnimation *animation = static_cast<QQuickAbstractAnimation*>(sender());
+    if (animation && animation->isRunning()) {
+        return;
+    }
+
+    // complete animations
+    UCListItemPrivate *listItem = UCListItemPrivate::get(item);
+    if (activeAnimations & SnapInAnimation) {
+        listItem->snapIn();
+        activeAnimations &= ~SnapInAnimation;
+    } else if (activeAnimations & SnapOutAnimation) {
+        listItem->snapOut();
+        activeAnimations &= ~SnapOutAnimation;
+    }
+
+    // clean animations
+    if (animation && !activeAnimations) {
+        disconnect(animation, &QQuickAbstractAnimation::runningChanged,
+                   this, &ListItemAnimator::completeAnimation);
+    }
+    if (snapBehavior && snapBehavior->enabled()) {
+        snapBehavior->setEnabled(false);
     }
 }
 
@@ -138,72 +164,95 @@
  * be disconnected, ascending Flickables will get unlocked (interactive value restored
  * to the state before they were locked) and ListItem.contentMoving will be reset.
  */
-void UCListItemSnapAnimator::snapOut()
+void UCListItemPrivate::snapOut()
 {
-    if (senderSignalIndex() >= 0) {
-        // disconnect animation, otherwise snapping will disconnect the panel
-        QQuickAbstractAnimation *snap = getDefaultAnimation();
-        QObject::disconnect(snap, 0, 0, 0);
-    }
-    UCListItemPrivate *listItem = UCListItemPrivate::get(item);
-    if (listItem->parentAttached) {
+    setHighlighted(false);
+    setSwiped(false);
+    if (parentAttached) {
+        Q_Q(UCListItem);
         // restore flickable's interactive and cleanup
-        listItem->parentAttached->disableInteractive(item, false);
+        parentAttached->disableInteractive(q, false);
         // no need to listen flickables any longer
-        listItem->listenToRebind(false);
+        listenToRebind(false);
     }
     // disconnect actions
-    UCActionPanel::ungrabPanel(listItem->leadingPanel);
-    UCActionPanel::ungrabPanel(listItem->trailingPanel);
+    UCActionPanel::ungrabPanel(leadingPanel);
+    UCActionPanel::ungrabPanel(trailingPanel);
+    // lock contentItem left/right edges
+    lockContentItem(true);
     // set contentMoved to false
-    listItem->setContentMoving(false);
-    // lock contentItem left/right edges
-    listItem->lockContentItem(true);
+    setContentMoving(false);
 }
 
 /*
  * Snap in only resets the ListItem.contentMoving property, but will keep leading/trailing
  * actions connected as well as all ascendant Flickables locked (interactive = false).
  */
-void UCListItemSnapAnimator::snapIn()
+void UCListItemPrivate::snapIn()
 {
-    if (senderSignalIndex() >= 0) {
-        // disconnect animation
-        QQuickAbstractAnimation *snap = getDefaultAnimation();
-        QObject::disconnect(snap, 0, 0, 0);
-    }
     // turn content moving off
-    UCListItemPrivate *listItem = UCListItemPrivate::get(item);
-    listItem->setContentMoving(false);
+    setContentMoving(false);
 }
 
 /*
- * Returns the animation specified by the style.
+ * Returns the animation specified by the style, and configures the snapBehavior
+ * controlling the animation.
  */
-QQuickPropertyAnimation *UCListItemSnapAnimator::getDefaultAnimation()
+QQuickAbstractAnimation *ListItemAnimator::getSnapBehavior()
 {
+    if (snapBehavior) {
+        return snapBehavior->animation();
+    }
+
     UCListItemPrivate *listItem = UCListItemPrivate::get(item);
+    // in order to get Behavior working properly, it must be created to have
+    // ListItem.contentItem as parent, and must be in the same context as its
+    // parent item
+    snapBehavior = new QQuickBehavior(listItem->contentItem);
+    snapBehavior->setParent(listItem->contentItem);
+    QQmlContext *context = qmlContext(listItem->contentItem);
+    QQmlEngine::setContextForObject(snapBehavior.data(), context);
+
     listItem->initStyleItem();
-    return listItem->styleItem ? listItem->styleItem->m_snapAnimation : 0;
+    QQuickAbstractAnimation *animation = listItem->styleItem ? listItem->styleItem->m_snapAnimation : 0;
+    if (animation) {
+        // patch behavior, use the same context as the animation
+        snapBehavior->setAnimation(animation);
+
+        // transfer animation to the contentItem
+        animation->setParent(listItem->contentItem);
+    }
+    QQmlProperty property(listItem->contentItem, "x", context);
+    snapBehavior->setTarget(property);
+    return animation;
 }
 
 /******************************************************************************
  * Divider
  */
-UCListItemDivider::UCListItemDivider(QObject *parent)
-    : QObject(parent)
-    , m_visible(true)
-    , m_colorFromChanged(false)
-    , m_colorToChanged(false)
-    , m_thickness(0)
-    , m_leftMargin(0)
-    , m_rightMargin(0)
-    , m_listItem(0)
-{
-    connect(&UCUnits::instance(), &UCUnits::gridUnitChanged, this, &UCListItemDivider::unitsChanged);
-    connect(&UCTheme::instance(), &UCTheme::paletteChanged, this, &UCListItemDivider::paletteChanged);
-    unitsChanged();
-    paletteChanged();
+class UCListItemDividerPrivate : public QQuickItemPrivate
+{
+    Q_DECLARE_PUBLIC(UCListItemDivider)
+public:
+    UCListItemDividerPrivate()
+        : QQuickItemPrivate()
+        , colorFromChanged(false)
+        , colorToChanged(false)
+        , listItem(0)
+    {}
+
+    bool colorFromChanged:1;
+    bool colorToChanged:1;
+    QColor colorFrom;
+    QColor colorTo;
+    QGradientStops gradient;
+    UCListItemPrivate *listItem;
+};
+
+UCListItemDivider::UCListItemDivider(UCListItem *parent)
+    : QQuickItem(*(new UCListItemDividerPrivate), parent)
+{
+    setFlag(ItemHasContents);
 }
 UCListItemDivider::~UCListItemDivider()
 {
@@ -211,17 +260,17 @@
 
 void UCListItemDivider::init(UCListItem *listItem)
 {
+    Q_D(UCListItemDivider);
     QQml_setParent_noEvent(this, listItem);
-    m_listItem = UCListItemPrivate::get(listItem);
-}
-
-void UCListItemDivider::unitsChanged()
-{
-    m_thickness = UCUnits::instance().dp(DIVIDER_THICKNESS_DP);
-    if (m_listItem) {
-        m_listItem->adjustContentItemHeight();
-        m_listItem->update();
-    }
+    d->listItem = UCListItemPrivate::get(listItem);
+    setParentItem(listItem);
+    // anchor to left/right/bottom of the ListItem
+    QQuickAnchors *anchors = d->anchors();
+    anchors->setLeft(d->listItem->left());
+    anchors->setRight(d->listItem->right());
+    anchors->setBottom(d->listItem->bottom());
+    // connect visible change so we relayout contentItem
+    connect(this, SIGNAL(visibleChanged()), listItem, SLOT(_q_relayout()));
 }
 
 void UCListItemDivider::paletteChanged()
@@ -232,14 +281,15 @@
     }
     // FIXME: we need a palette value for divider colors, till then base on the background
     // luminance
-    if (!m_colorFromChanged || !m_colorToChanged) {
+    Q_D(UCListItemDivider);
+    if (!d->colorFromChanged || !d->colorToChanged) {
         qreal luminance = (background.red()*212 + background.green()*715 + background.blue()*73)/1000.0/255.0;
         bool lightBackground = (luminance > 0.85);
-        if (!m_colorFromChanged) {
-            m_colorFrom = lightBackground ? QColor("#26000000") : QColor("#26FFFFFF");
+        if (!d->colorFromChanged) {
+            d->colorFrom = lightBackground ? QColor("#26000000") : QColor("#26FFFFFF");
         }
-        if (!m_colorToChanged) {
-            m_colorTo = lightBackground ? QColor("#14FFFFFF") : QColor("#14000000");
+        if (!d->colorToChanged) {
+            d->colorTo = lightBackground ? QColor("#14FFFFFF") : QColor("#14000000");
         }
         updateGradient();
     }
@@ -247,27 +297,30 @@
 
 void UCListItemDivider::updateGradient()
 {
-    m_gradient.clear();
-    m_gradient.append(QGradientStop(0.0, m_colorFrom));
-    m_gradient.append(QGradientStop(0.49, m_colorFrom));
-    m_gradient.append(QGradientStop(0.5, m_colorTo));
-    m_gradient.append(QGradientStop(1.0, m_colorTo));
-    if (m_listItem) {
-        m_listItem->update();
+    Q_D(UCListItemDivider);
+    d->gradient.clear();
+    d->gradient.append(QGradientStop(0.0, d->colorFrom));
+    d->gradient.append(QGradientStop(0.49, d->colorFrom));
+    d->gradient.append(QGradientStop(0.5, d->colorTo));
+    d->gradient.append(QGradientStop(1.0, d->colorTo));
+    if (d->listItem) {
+        d->listItem->update();
     }
 }
 
-QSGNode *UCListItemDivider::paint(QSGNode *node, const QRectF &rect)
+QSGNode *UCListItemDivider::updatePaintNode(QSGNode *node, UpdatePaintNodeData *data)
 {
+    Q_UNUSED(data);
+    Q_D(UCListItemDivider);
     QSGRectangleNode *dividerNode = static_cast<QSGRectangleNode*>(node);
-    bool lastItem = m_listItem->countOwner ? (m_listItem->index() == (m_listItem->countOwner->property("count").toInt() - 1)): false;
-    if (m_visible && !lastItem && (m_gradient.size() > 0) && ((m_colorFrom.alphaF() >= (1.0f / 255.0f)) || (m_colorTo.alphaF() >= (1.0f / 255.0f)))) {
-        if (!dividerNode) {
-            dividerNode = m_listItem->sceneGraphContext()->createRectangleNode();
-        }
-        QRectF divider(m_leftMargin, rect.height() - m_thickness, rect.width() - m_leftMargin - m_rightMargin, m_thickness);
-        dividerNode->setRect(divider);
-        dividerNode->setGradientStops(m_gradient);
+    if (!dividerNode) {
+        dividerNode = d->sceneGraphContext()->createRectangleNode();
+    }
+
+    bool lastItem = d->listItem->countOwner ? (d->listItem->index() == (d->listItem->countOwner->property("count").toInt() - 1)): false;
+    if (!lastItem && (d->gradient.size() > 0) && ((d->colorFrom.alphaF() >= (1.0f / 255.0f)) || (d->colorTo.alphaF() >= (1.0f / 255.0f)))) {
+        dividerNode->setRect(boundingRect());
+        dividerNode->setGradientStops(d->gradient);
         dividerNode->update();
         return dividerNode;
     } else if (node) {
@@ -277,55 +330,36 @@
     return 0;
 }
 
-void UCListItemDivider::setVisible(bool visible)
-{
-    if (m_visible == visible) {
-        return;
-    }
-    m_visible = visible;
-    Q_EMIT visibleChanged();
-    // set/reset contentItem's bottomMargin
-    m_listItem->adjustContentItemHeight();
-}
-
-void UCListItemDivider::setLeftMargin(qreal leftMargin)
-{
-    if (m_leftMargin == leftMargin) {
-        return;
-    }
-    m_leftMargin = leftMargin;
-    m_listItem->update();
-    Q_EMIT leftMarginChanged();
-}
-
-void UCListItemDivider::setRightMargin(qreal rightMargin)
-{
-    if (m_rightMargin == rightMargin) {
-        return;
-    }
-    m_rightMargin = rightMargin;
-    m_listItem->update();
-    Q_EMIT rightMarginChanged();
-}
-
+QColor UCListItemDivider::colorFrom() const
+{
+    Q_D(const UCListItemDivider);
+    return d->colorFrom;
+}
 void UCListItemDivider::setColorFrom(const QColor &color)
 {
-    if (m_colorFrom == color) {
+    Q_D(UCListItemDivider);
+    if (d->colorFrom == color) {
         return;
     }
-    m_colorFrom = color;
-    m_colorFromChanged = true;
+    d->colorFrom = color;
+    d->colorFromChanged = true;
     updateGradient();
     Q_EMIT colorFromChanged();
 }
 
+QColor UCListItemDivider::colorTo() const
+{
+    Q_D(const UCListItemDivider);
+    return d->colorTo;
+}
 void UCListItemDivider::setColorTo(const QColor &color)
 {
-    if (m_colorTo == color) {
+    Q_D(UCListItemDivider);
+    if (d->colorTo == color) {
         return;
     }
-    m_colorTo = color;
-    m_colorToChanged = true;
+    d->colorTo = color;
+    d->colorToChanged = true;
     updateGradient();
     Q_EMIT colorToChanged();
 }
@@ -354,7 +388,6 @@
     , trailingActions(0)
     , leadingPanel(0)
     , trailingPanel(0)
-    , animator(0)
     , mainAction(0)
     , styleComponent(0)
     , implicitStyleComponent(0)
@@ -368,9 +401,11 @@
 void UCListItemPrivate::init()
 {
     Q_Q(UCListItem);
+    animator.init(q);
     contentItem->setObjectName("ListItemHolder");
     QQml_setParent_noEvent(contentItem, q);
     contentItem->setParentItem(q);
+    contentItem->setClip(true);
     divider->init(q);
     // content will be redirected to the contentItem, therefore we must report
     // children changes as it would come from the main component
@@ -410,6 +445,8 @@
 void UCListItemPrivate::_q_updateThemedData()
 {
     Q_Q(UCListItem);
+    // update the divider colors
+    divider->paletteChanged();
     // we reload the implicit style only if the custom style is not set, and
     // the component is ready
     if (!styleComponent && ready) {
@@ -422,17 +459,17 @@
     }
 }
 
-void UCListItemPrivate::_q_rebound()
+// re-layouting the ListItem's contentItem
+void UCListItemPrivate::_q_relayout()
 {
-    setHighlighted(false);
-    // initiate rebinding only if there were actions tugged
-    if (!UCActionPanel::isConnected(leadingPanel) &&
-        !UCActionPanel::isConnected(trailingPanel)) {
-        return;
+    QQuickAnchors *contentAnchors = QQuickItemPrivate::get(contentItem)->anchors();
+    QQuickAnchorLine anchorLine;
+    if (divider->isVisible()) {
+        anchorLine = QQuickItemPrivate::get(divider)->top();
+    } else {
+        anchorLine = bottom();
     }
-    setSwiped(false);
-    // rebound to zero
-    animator->snap(0);
+    contentAnchors->setBottom(anchorLine);
 }
 
 void UCListItemPrivate::_q_updateIndex()
@@ -465,7 +502,7 @@
         return;
     }
     // make sure we're rebound before we change the panel component
-    promptRebound();
+    snapOut();
     bool reloadStyle = styleItem != 0;
     if (styleItem) {
         styleItem->deleteLater();
@@ -489,7 +526,7 @@
         styleComponent = 0;
         // rebound as the current panels are not gonna be valid anymore
         if (swiped) {
-            promptRebound();
+            snapOut();
         }
         bool reloadStyle = styleItem != 0;
         if (styleItem) {
@@ -531,6 +568,7 @@
         return;
     }
     QQmlContext *context = new QQmlContext(qmlContext(q));
+    context->setContextProperty("styledItem", q);
     QObject *object = delegate->beginCreate(context);
     styleItem = qobject_cast<UCListItemStyle*>(object);
     if (!styleItem) {
@@ -560,20 +598,13 @@
     return styleItem;
 }
 
-// rebound without animation
-void UCListItemPrivate::promptRebound()
-{
-    setHighlighted(false);
-    setSwiped(false);
-    if (animator) {
-        animator->snapOut();
-    }
-}
-
 // called when units size changes
 void UCListItemPrivate::_q_updateSize()
 {
     Q_Q(UCListItem);
+
+    // update divider thickness
+    divider->setImplicitHeight(UCUnits::instance().dp(DIVIDER_THICKNESS_DP));
     QQuickItem *owner = flickable ? flickable : parentItem;
     q->setImplicitWidth(owner ? owner->width() : UCUnits::instance().gu(IMPLICIT_LISTITEM_WIDTH_GU));
     q->setImplicitHeight(UCUnits::instance().gu(IMPLICIT_LISTITEM_HEIGHT_GU));
@@ -666,17 +697,6 @@
     }
 }
 
-// adjust contentItem height depending on teh divider's visibility
-void UCListItemPrivate::adjustContentItemHeight()
-{
-    QQuickAnchors *contentAnchors = QQuickItemPrivate::get(contentItem)->anchors();
-    if (divider->m_visible) {
-        contentAnchors->setBottomMargin(divider->m_thickness);
-    } else {
-        contentAnchors->resetBottomMargin();
-    }
-}
-
 void UCListItemPrivate::update()
 {
     if (!ready) {
@@ -781,7 +801,7 @@
  * Being an Item, all properties can be accessed or altered. However, make sure you
  * never change \c x, \c y, \c width, \c height or \c anchors properties as those are
  * controlled by the ListItem itself when leading or trailing actions are revealed
- * and thus might cause the component to misbehave.
+ * and thus might cause the component to misbehave. Anchors margins are free to alter.
  *
  * Each ListItem has a thin divider shown on the bottom of the component. This
  * divider can be configured through the \c divider grouped property, which can
@@ -880,35 +900,19 @@
 
 UCListItemAttached *UCListItem::qmlAttachedProperties(QObject *owner)
 {
-    /*
-     * Detect the attachee, whether is it a child item of the panelItem. The panelItem
-     * itself cannot be detected, as the object can be attached during the call of
-     * component.beginCreate().
-     */
-    UCListItemAttached *attached = new UCListItemAttached(owner);
-    QQuickItem *item = qobject_cast<QQuickItem*>(owner);
-    while (item) {
-        // has item our attached property?
-        UCListItemAttached *itemAttached = static_cast<UCListItemAttached*>(
-                    qmlAttachedPropertiesObject<UCListItem>(item, false));
-        if (itemAttached) {
-            attached->connectToAttached(itemAttached);
-            break;
-        }
-        item = item->parentItem();
-    }
-    return attached;
+    return new UCListItemAttached(owner);
 }
 
 void UCListItem::componentComplete()
 {
     UCStyledItemBase::componentComplete();
     Q_D(UCListItem);
+    // set contentItem's context
+    QQmlEngine::setContextForObject(d->contentItem, qmlContext(this));
     // anchor contentItem prior doing anything else
     QQuickAnchors *contentAnchors = QQuickItemPrivate::get(d->contentItem)->anchors();
     contentAnchors->setTop(d->top());
-    contentAnchors->setBottom(d->bottom());
-    d->adjustContentItemHeight();
+    d->_q_relayout();
     d->lockContentItem(true);
 
     d->ready = true;
@@ -986,8 +990,12 @@
     }
     if (color.alphaF() >= (1.0f / 255.0f)) {
         rectNode->setColor(color);
-        // cover only the area of the contentItem
-        rectNode->setRect(d->contentItem->boundingRect());
+        // cover only the area of the contentItem, removing divider's thickness
+        QRectF rect(boundingRect());
+        if (d->divider->isVisible()) {
+            rect -= QMarginsF(0, 0, 0, d->divider->height());
+        }
+        rectNode->setRect(rect);
         rectNode->setGradientStops(QGradientStops());
         rectNode->setAntialiasing(true);
         rectNode->setAntialiasing(false);
@@ -998,24 +1006,6 @@
         rectNode = 0;
     }
     oldNode = rectNode;
-    QSGNode *dividerNode = oldNode ? oldNode->childAtIndex(0) : 0;
-    if (d->divider && d->divider->m_visible) {
-        QSGNode *newNode = d->divider->paint(dividerNode, boundingRect());
-        if (newNode != dividerNode && oldNode) {
-            if (dividerNode) {
-                oldNode->removeChildNode(dividerNode);
-            }
-            if (newNode) {
-                oldNode->appendChildNode(newNode);
-            }
-        }
-        if (!oldNode) {
-            oldNode = newNode;
-        }
-    } else if (dividerNode) {
-        // the divider painter node may be still added as child, so remove it
-        oldNode->removeChildNode(dividerNode);
-    }
     return oldNode;
 }
 
@@ -1030,9 +1020,7 @@
     if (d->canHighlight(event) && !d->suppressClick
             && !d->highlighted && event->button() == Qt::LeftButton) {
         // stop any ongoing animation!
-        if (d->animator) {
-            d->animator->stop();
-        }
+        d->animator.stop();
         d->setHighlighted(true);
         d->lastPos = d->pressedPos = event->localPos();
         // connect the Flickable to know when to rebound
@@ -1062,11 +1050,14 @@
         }
 
         if (!d->suppressClick) {
-            Q_EMIT clicked();
-            if (d->mainAction) {
-                Q_EMIT d->mainAction->trigger(d->index());
+            // emit clicked only if not swiped
+            if (!d->swiped) {
+                Q_EMIT clicked();
+                if (d->mainAction) {
+                    Q_EMIT d->mainAction->trigger(d->index());
+                }
             }
-            d->_q_rebound();
+            d->animator.snap(0);
         } else {
             d->suppressClick = false;
         }
@@ -1103,10 +1094,6 @@
             if (d->parentAttached) {
                 d->parentAttached->disableInteractive(this, true);
             }
-            // create animator if not created yet
-            if (!d->animator) {
-                d->animator = new UCListItemSnapAnimator(this);
-            }
         }
     }
 
@@ -1125,14 +1112,15 @@
             d->setSwiped(true);
             d->contentItem->setX(x);
             // decide which panel is visible by checking the contentItem's X coordinates
-            if (d->contentItem->x() > 0) {
+            qreal margin = QQuickItemPrivate::get(d->contentItem)->anchors()->leftMargin();
+            if (d->contentItem->x() > margin) {
                 if (d->leadingPanel) {
                     d->leadingPanel->panel()->setVisible(true);
                 }
                 if (d->trailingPanel) {
                     d->trailingPanel->panel()->setVisible(false);
                 }
-            } else if (d->contentItem->x() < 0) {
+            } else if (d->contentItem->x() < margin) {
                 // trailing revealed
                 if (d->leadingPanel) {
                     d->leadingPanel->panel()->setVisible(false);
@@ -1185,7 +1173,7 @@
     }
     if (!myPos.isNull() && !contains(myPos)) {
         Q_D(UCListItem);
-        d->_q_rebound();
+        d->animator.snap(0);
         // only accept event, but let it be handled by the underlying or surrounding Flickables
         event->accept();
     }
@@ -1195,7 +1183,7 @@
 void UCListItem::timerEvent(QTimerEvent *event)
 {
     Q_D(UCListItem);
-    if (event->timerId() == d->pressAndHoldTimer.timerId() && d->highlighted) {
+    if (event->timerId() == d->pressAndHoldTimer.timerId() && d->highlighted && !d->swiped) {
         d->pressAndHoldTimer.stop();
         if (isEnabled() && d->isPressAndHoldConnected()) {
             d->suppressClick = true;
@@ -1226,7 +1214,7 @@
         return;
     }
     // snap out before we change the actions
-    d->promptRebound();
+    d->snapOut();
     // then delete panel
     delete d->leadingPanel;
     d->leadingPanel = 0;
@@ -1254,7 +1242,7 @@
         return;
     }
     // snap out before we change the actions
-    d->promptRebound();
+    d->snapOut();
     // then delete panel
     delete d->trailingPanel;
     d->trailingPanel = 0;
@@ -1265,7 +1253,22 @@
 /*!
  * \qmlproperty Item ListItem::contentItem
  *
- * contentItem holds the components placed on a ListItem.
+ * contentItem holds the components placed on a ListItem. It is anchored to the
+ * ListItem on left, top and right, and to the divider on the bottom, or to the
+ * ListItem's bottom in case the divider is not visible. The content is clipped
+ * by default. It is not recommended to change the anchors as the ListItem controls
+ * them, however any other property value is free to change.
+ * Example:
+ * \qml
+ * ListItem {
+ *     contentItem.anchors {
+ *         leftMargin: units.gu(2)
+ *         rightMargin: units.gu(2)
+ *         topMargin: units.gu(0.5)
+ *         bottomMargin: units.gu(0.5)
+ *     }
+ * }
+ * \endqml
  */
 QQuickItem* UCListItem::contentItem() const
 {
@@ -1275,27 +1278,18 @@
 
 /*!
  * \qmlpropertygroup ::ListItem::divider
- * \qmlproperty bool ListItem::divider.visible
- * \qmlproperty real ListItem::divider.leftMargin
- * \qmlproperty real ListItem::divider.rightMargin
  * \qmlproperty real ListItem::divider.colorFrom
  * \qmlproperty real ListItem::divider.colorTo
  *
  * This grouped property configures the thin divider shown in the bottom of the
- * component. Configures the visibility and the margins from the left and right
- * of the ListItem. When swiped left or right to reveal the actions, it is not
- * moved together with the content. \c colorFrom and \c colorTo configure
- * the starting and ending colors of the divider.
+ * component. The divider is not moved together with the content when swiped left
+ * or right to reveal the actions. \c colorFrom and \c colorTo configure
+ * the starting and ending colors of the divider. Beside these properties all Item
+ * specific properties can be accessed.
  *
  * When \c visible is true, the ListItem's content size gets thinner with the
- * divider's \c thickness.
- *
- * The default values for the properties are:
- * \list
- * \li \c visible: true
- * \li \c leftMargin: 0
- * \li \c rightMargin: 0
- * \endlist
+ * divider's \c thickness. By default the divider is anchored to the bottom, left
+ * right of the ListItem, and has a 2dp height.
  */
 UCListItemDivider* UCListItem::divider() const
 {

=== modified file 'modules/Ubuntu/Components/plugin/uclistitem.h'
--- modules/Ubuntu/Components/plugin/uclistitem.h	2015-01-15 10:39:27 +0000
+++ modules/Ubuntu/Components/plugin/uclistitem.h	2015-02-10 13:46:20 +0000
@@ -106,13 +106,40 @@
 private:
     Q_DECLARE_PRIVATE(UCListItem)
     Q_PRIVATE_SLOT(d_func(), void _q_updateThemedData())
-    Q_PRIVATE_SLOT(d_func(), void _q_rebound())
+    Q_PRIVATE_SLOT(d_func(), void _q_relayout())
     Q_PRIVATE_SLOT(d_func(), void _q_updateSize())
     Q_PRIVATE_SLOT(d_func(), void _q_updateIndex())
 };
-
 QML_DECLARE_TYPEINFO(UCListItem, QML_HAS_ATTACHED_PROPERTIES)
 
+class UCListItemDividerPrivate;
+class UCListItemDivider : public QQuickItem
+{
+    Q_OBJECT
+    Q_PROPERTY(QColor colorFrom READ colorFrom WRITE setColorFrom NOTIFY colorFromChanged)
+    Q_PROPERTY(QColor colorTo READ colorTo WRITE setColorTo NOTIFY colorToChanged)
+public:
+    explicit UCListItemDivider(UCListItem *parent = 0);
+    ~UCListItemDivider();
+    void init(UCListItem *listItem);
+    void paletteChanged();
+
+Q_SIGNALS:
+    void colorFromChanged();
+    void colorToChanged();
+
+protected:
+    QSGNode *updatePaintNode(QSGNode *node, UpdatePaintNodeData *data);
+
+private:
+    void updateGradient();
+    QColor colorFrom() const;
+    void setColorFrom(const QColor &color);
+    QColor colorTo() const;
+    void setColorTo(const QColor &color);
+    Q_DECLARE_PRIVATE(UCListItemDivider)
+};
+
 class UCAction;
 class UCListItemActions;
 class UCListItemAttachedPrivate;
@@ -121,14 +148,12 @@
     Q_OBJECT
     Q_PROPERTY(UCListItemActions *actions READ actions NOTIFY actionsChanged)
     Q_PROPERTY(QQmlListProperty<UCAction> visibleActions READ visibleActions NOTIFY visibleActionsChanged)
-    Q_PROPERTY(UCListItem *item READ item NOTIFY itemChanged)
     Q_PROPERTY(int index READ index NOTIFY indexChanged)
     Q_PROPERTY(UCListItem::PanelStatus panelStatus READ panelStatus NOTIFY panelStatusChanged)
 public:
     UCListItemAttached(QObject *parent = 0);
     ~UCListItemAttached();
     void setList(UCListItem *list, bool leading, bool visualizeActions);
-    void connectToAttached(UCListItemAttached *parentAttached);
 
     UCListItemActions *actions() const;
     QQmlListProperty<UCAction> visibleActions();
@@ -142,7 +167,6 @@
 Q_SIGNALS:
     void actionsChanged();
     void visibleActionsChanged();
-    void itemChanged();
     void indexChanged();
     void panelStatusChanged();
 

=== modified file 'modules/Ubuntu/Components/plugin/uclistitem_p.h'
--- modules/Ubuntu/Components/plugin/uclistitem_p.h	2015-02-05 14:11:27 +0000
+++ modules/Ubuntu/Components/plugin/uclistitem_p.h	2015-02-10 13:46:20 +0000
@@ -31,13 +31,45 @@
 #define IMPLICIT_LISTITEM_HEIGHT_GU     7
 #define DIVIDER_THICKNESS_DP            2
 #define DEFAULT_SWIPE_THRESHOLD_GU      1.5
+#define LAYOUT_HMARGIN_GU               2
+#define LAYOUT_VMARGIN_GU               0.5
+
+class QQuickAbstractAnimation;
+class QQuickBehavior;
+class ListItemAnimator : public QObject
+{
+    Q_OBJECT
+public:
+    enum Animation {
+        SnapInAnimation     = 0x01,
+        SnapOutAnimation    = 0x02
+    };
+
+    ListItemAnimator(QObject *parent = 0);
+    ~ListItemAnimator();
+    void init(UCListItem *listItem)
+    {
+        item = listItem;
+    }
+
+    bool snap(qreal to);
+    void stop();
+
+public Q_SLOTS:
+    void completeAnimation();
+
+private:
+    QQuickAbstractAnimation *getSnapBehavior();
+
+private:
+    int activeAnimations;
+    UCListItem *item;
+    QPointer<QQuickBehavior> snapBehavior;
+};
 
 class QQuickFlickable;
-class QQuickPropertyAnimation;
-class UCListItemContent;
 class UCListItemDivider;
 class UCListItemActions;
-class UCListItemSnapAnimator;
 class UCListItemStyle;
 class UCActionPanel;
 class UCListItemPrivate : public UCStyledItemBasePrivate
@@ -57,8 +89,7 @@
     bool isClickedConnected();
     bool isPressAndHoldConnected();
     void _q_updateThemedData();
-    void _q_rebound();
-    void promptRebound();
+    void _q_relayout();
     void _q_updateSize();
     void _q_updateIndex();
     int index();
@@ -67,9 +98,10 @@
     void setSwiped(bool tugged);
     void listenToRebind(bool listen);
     void lockContentItem(bool lock);
-    void adjustContentItemHeight();
     void update();
     void clampAndMoveX(qreal &x, qreal dx);
+    void snapOut();
+    void snapIn();
 
     bool highlighted:1;
     bool contentMoved:1;
@@ -95,7 +127,7 @@
     UCListItemActions *trailingActions;
     UCActionPanel *leadingPanel;
     UCActionPanel *trailingPanel;
-    UCListItemSnapAnimator *animator;
+    ListItemAnimator animator;
     UCAction *mainAction;
 
     // FIXME move these to StyledItemBase togehther with subtheming.
@@ -192,80 +224,8 @@
     bool connected:1;
 };
 
-class UCListItemDivider : public QObject
-{
-    Q_OBJECT
-    Q_PROPERTY(bool visible MEMBER m_visible WRITE setVisible NOTIFY visibleChanged)
-    Q_PROPERTY(qreal leftMargin MEMBER m_leftMargin WRITE setLeftMargin NOTIFY leftMarginChanged)
-    Q_PROPERTY(qreal rightMargin MEMBER m_rightMargin WRITE setRightMargin NOTIFY rightMarginChanged)
-    Q_PROPERTY(QColor colorFrom MEMBER m_colorFrom WRITE setColorFrom NOTIFY colorFromChanged)
-    Q_PROPERTY(QColor colorTo MEMBER m_colorTo WRITE setColorTo NOTIFY colorToChanged)
-public:
-    explicit UCListItemDivider(QObject *parent = 0);
-    ~UCListItemDivider();
-    void init(UCListItem *listItem);
-
-Q_SIGNALS:
-    void visibleChanged();
-    void leftMarginChanged();
-    void rightMarginChanged();
-    void colorFromChanged();
-    void colorToChanged();
-
-protected:
-    QSGNode *paint(QSGNode *node, const QRectF &rect);
-
-private Q_SLOTS:
-    void unitsChanged();
-    void paletteChanged();
-
-private:
-    void updateGradient();
-    void setVisible(bool visible);
-    void setLeftMargin(qreal leftMargin);
-    void setRightMargin(qreal rightMargin);
-    void setColorFrom(const QColor &color);
-    void setColorTo(const QColor &color);
-
-    bool m_visible:1;
-    bool m_colorFromChanged:1;
-    bool m_colorToChanged:1;
-    qreal m_thickness;
-    qreal m_leftMargin;
-    qreal m_rightMargin;
-    QColor m_colorFrom;
-    QColor m_colorTo;
-    QGradientStops m_gradient;
-    UCListItemPrivate *m_listItem;
-    friend class UCListItem;
-    friend class UCListItemPrivate;
-};
-
 QColor getPaletteColor(const char *profile, const char *color);
 
 QML_DECLARE_TYPE(UCListItemDivider)
 
-class QQuickPropertyAnimation;
-class UCListItemSnapAnimator : public QObject
-{
-    Q_OBJECT
-public:
-    UCListItemSnapAnimator(UCListItem *item);
-    ~UCListItemSnapAnimator();
-
-    bool snap(qreal to);
-    void stop();
-    void complete();
-
-public Q_SLOTS:
-    void snapOut();
-    void snapIn();
-
-    QQuickPropertyAnimation *getDefaultAnimation();
-
-private:
-    bool active;
-    UCListItem *item;
-};
-
 #endif // UCVIEWITEM_P_H

=== modified file 'modules/Ubuntu/Components/plugin/uclistitemattached.cpp'
--- modules/Ubuntu/Components/plugin/uclistitemattached.cpp	2015-01-12 15:44:59 +0000
+++ modules/Ubuntu/Components/plugin/uclistitemattached.cpp	2015-02-10 13:46:20 +0000
@@ -30,13 +30,6 @@
 {
 }
 
-void UCListItemAttached::connectToAttached(UCListItemAttached *parentAttached)
-{
-    bool visualizeActions = UCListItemAttachedPrivate::get(parentAttached)->panel;
-    bool isLeading = visualizeActions ? UCListItemAttachedPrivate::get(parentAttached)->panel->isLeading() : false;
-    setList(parentAttached->item(), isLeading, visualizeActions);
-}
-
 void UCListItemAttached::setList(UCListItem *list, bool leading, bool visualizeActions)
 {
     Q_D(UCListItemAttached);
@@ -44,7 +37,6 @@
         return;
     }
     d->listItem = list;
-    Q_EMIT itemChanged();
 
     if (visualizeActions) {
         d->panel = leading ? UCListItemPrivate::get(d->listItem)->leadingPanel : UCListItemPrivate::get(d->listItem)->trailingPanel;
@@ -169,13 +161,5 @@
     }
     UCListItemPrivate *listItem = UCListItemPrivate::get(d->listItem);
     position *= (itemStatus == UCListItem::Leading) ? 1 : -1;
-    if (position == 0.0) {
-        listItem->_q_rebound();
-    } else {
-        if (listItem->animator) {
-            listItem->animator->snap(position);
-        } else {
-            listItem->contentItem->setX(position);
-        }
-    }
+    listItem->animator.snap(position);
 }

=== modified file 'modules/Ubuntu/Components/plugin/uclistitemstyle.cpp'
--- modules/Ubuntu/Components/plugin/uclistitemstyle.cpp	2014-12-01 11:13:10 +0000
+++ modules/Ubuntu/Components/plugin/uclistitemstyle.cpp	2015-02-10 13:46:20 +0000
@@ -15,6 +15,8 @@
  */
 
 #include "uclistitemstyle.h"
+#include <QtQml/QQmlEngine>
+#include <QtQuick/private/qquickbehavior_p.h>
 
 /*!
  * \qmltype ListItemStyle
@@ -60,8 +62,10 @@
  */
 
 /*!
- * \qmlproperty PropertyAnimation ListItemStyle::snapAnimation
- * Holds the animation used in animating when snapped in or out.
+ * \qmlproperty Animation ListItemStyle::snapAnimation
+ * Holds the behavior used in animating when snapped in or out. It can hold many
+ * animations, and will be used in a Behavior on the \l ListItem::contentItem
+ * \c x property.
  */
 
 /*!

=== modified file 'modules/Ubuntu/Components/plugin/uclistitemstyle.h'
--- modules/Ubuntu/Components/plugin/uclistitemstyle.h	2015-01-07 07:41:29 +0000
+++ modules/Ubuntu/Components/plugin/uclistitemstyle.h	2015-02-10 13:46:20 +0000
@@ -19,14 +19,15 @@
 #include <QtQuick/QQuickItem>
 
 class QQmlComponent;
-class QQuickPropertyAnimation;
+class QQuickAbstractAnimation;
+class QQuickBehavior;
 class UCListItemStyle : public QQuickItem
 {
     Q_OBJECT
     Q_PROPERTY(QQmlComponent *actionsDelegate MEMBER m_actionsDelegate NOTIFY actionsDelegateChanged)
     Q_PROPERTY(QQmlComponent *selectionDelegate MEMBER m_selectionDelegate NOTIFY selectionDelegateChanged)
     Q_PROPERTY(QQmlComponent *dragHandlerDelegate MEMBER m_dragHandlerDelegate NOTIFY dragHandlerDelegateChanged)
-    Q_PROPERTY(QQuickPropertyAnimation *snapAnimation MEMBER m_snapAnimation NOTIFY snapAnimationChanged)
+    Q_PROPERTY(QQuickAbstractAnimation *snapAnimation MEMBER m_snapAnimation NOTIFY snapAnimationChanged)
     Q_PROPERTY(qreal swipeOvershoot MEMBER m_swipeOvershoot NOTIFY swipeOvershootChanged)
 public:
     explicit UCListItemStyle(QQuickItem *parent = 0);
@@ -42,12 +43,12 @@
     QQmlComponent *m_actionsDelegate;
     QQmlComponent *m_selectionDelegate;
     QQmlComponent *m_dragHandlerDelegate;
-    QQuickPropertyAnimation *m_snapAnimation;
+    QQuickAbstractAnimation *m_snapAnimation;
     qreal m_swipeOvershoot;
 
     friend class UCListItemPrivate;
     friend class UCActionPanel;
-    friend class UCListItemSnapAnimator;
+    friend class ListItemAnimator;
 };
 
 #endif // UCLISTITEMSTYLE_H

=== modified file 'modules/Ubuntu/Components/plugin/ucviewitemsattached.cpp'
--- modules/Ubuntu/Components/plugin/ucviewitemsattached.cpp	2015-01-20 10:24:08 +0000
+++ modules/Ubuntu/Components/plugin/ucviewitemsattached.cpp	2015-02-10 13:46:20 +0000
@@ -196,14 +196,8 @@
 {
     Q_D(UCViewItemsAttached);
     if (d->boundItem) {
-        // depending on content item's X coordinate, we either do animated or prompt rebind
-        if (d->boundItem->contentItem()->x() != 0.0) {
-            // content is not in origin, rebind
-            UCListItemPrivate::get(d->boundItem.data())->_q_rebound();
-        } else {
-            // do some cleanup
-            UCListItemPrivate::get(d->boundItem.data())->promptRebound();
-        }
+        // snap out before we unbind
+        UCListItemPrivate::get(d->boundItem)->animator.snap(0);
         d->boundItem.clear();
     }
     // clear binding list

=== modified file 'tests/resources/listitems/ListItemTest.qml'
--- tests/resources/listitems/ListItemTest.qml	2015-02-05 14:11:27 +0000
+++ tests/resources/listitems/ListItemTest.qml	2015-02-10 13:46:20 +0000
@@ -95,7 +95,7 @@
             color: "lime"
             onClicked: {
                 print("click")
-                main.override = !main.override
+                units.gridUnit += 2;
             }
             onPressAndHold: print("pressAndHold", objectName)
             Label {
@@ -154,7 +154,7 @@
             id: view
             clip: true
             width: parent.width
-            height: units.gu(20)
+            height: units.gu(28)
             model: 25
             pressDelay: 0
             delegate: ListItem {
@@ -164,10 +164,16 @@
                 onPressAndHold: print("pressAndHold")
                 leadingActions: leading
                 trailingActions: leadingActions
+
                 Label {
-                    text: modelData + " item"
+                    anchors.fill: parent
+                    verticalAlignment: Text.AlignVCenter
+                    text: "This is one Label split in two lines.\n" +
+                          "The second line - item #" + modelData
                 }
 
+                onContentMovementEnded: print('end')
+
                 states: State {
                     name: "override"
                     when: main.override
@@ -181,7 +187,7 @@
         Flickable {
             id: flicker
             width: parent.width
-            height: units.gu(20)
+            height: units.gu(28)
             clip: true
             contentHeight: column.childrenRect.height
             ListItemActions {
@@ -198,7 +204,7 @@
                     model: 10
                     ListItem {
                         objectName: "InFlickable"+index
-                        color: "red"
+                        color: UbuntuColors.red
                         highlightColor: "lime"
                         divider.colorFrom: UbuntuColors.green
                         swipeOvershoot: units.gu(10)

=== modified file 'tests/unit_x11/tst_components/tst_listitem.qml'
--- tests/unit_x11/tst_components/tst_listitem.qml	2015-02-05 14:11:27 +0000
+++ tests/unit_x11/tst_components/tst_listitem.qml	2015-02-10 13:46:20 +0000
@@ -86,9 +86,10 @@
             color: "blue"
             leadingActions: leading
             trailingActions: trailing
-            Item {
+            Label {
                 id: bodyItem
                 anchors.fill: parent
+                text: "Data"
             }
         }
         ListItem {
@@ -112,6 +113,9 @@
                 width: parent.width
                 leadingActions: leading
                 trailingActions: trailing
+                Label {
+                    text: "Data " + index
+                }
             }
         }
         Flickable {
@@ -140,7 +144,6 @@
             id: movingSpy
             signalName: "contentMovementEnded"
         }
-
         SignalSpy {
             id: highlightedSpy
             signalName: "highlightedChanged"
@@ -171,14 +174,15 @@
                 watchTarget = item;
             }
 
-            movingSpy.target = null;
-            movingSpy.target = watchTarget;
-            movingSpy.clear();
-            mouseClick(item, centerOf(item).x, centerOf(item).y);
-            if (watchTarget.contentMoving) {
+            if (watchTarget.contentItem.x != watchTarget.contentItem.anchors.leftMargin) {
+                movingSpy.target = watchTarget;
+                movingSpy.clear();
+                mouseClick(item, centerOf(item).x, centerOf(item).y);
                 movingSpy.wait();
+                tryCompareFunction(function() {
+                    return watchTarget.contentItem.x == watchTarget.contentItem.anchors.leftMargin;
+                }, true, 500);
             }
-            movingSpy.target = null;
         }
 
         function initTestCase() {
@@ -188,6 +192,7 @@
 
         function cleanup() {
             testItem.action = null;
+            testItem.contentItem.anchors.margins = 0;
             movingSpy.clear();
             highlightedSpy.clear();
             clickSpy.clear();
@@ -213,8 +218,8 @@
             compare(defaults.highlighted, false, "Not highlighted by default");
             compare(defaults.swipeOvershoot, 0.0, "No overshoot till the style is loaded!");
             compare(defaults.divider.visible, true, "divider is visible by default");
-            compare(defaults.divider.leftMargin, 0, "divider's left margin is 0");
-            compare(defaults.divider.rightMargin, 0, "divider's right margin is 0");
+            compare(defaults.divider.anchors.leftMargin, 0, "divider's left margin is 0");
+            compare(defaults.divider.anchors.rightMargin, 0, "divider's right margin is 0");
             compare(defaults.divider.colorFrom, "#000000", "colorFrom differs.");
             fuzzyCompare(defaults.divider.colorFrom.a, 0.14, 0.01, "colorFrom alpha differs");
             compare(defaults.divider.colorTo, "#ffffff", "colorTo differs.");
@@ -266,6 +271,38 @@
             clickSpy.wait();
         }
 
+        function test_no_click_when_swiped() {
+            var item = findChild(listView, "listItem0");
+            clickSpy.target = item;
+            clickSpy.clear();
+            movingSpy.target = item;
+            flick(item, centerOf(item).x, centerOf(item).y, units.gu(20), 0);
+            movingSpy.wait();
+
+            // click over the contentItem
+            movingSpy.clear();
+            mouseClick(item.contentItem, 1, 1);
+            compare(clickSpy.count, 0, "No click() should be emitted on a swiped in ListItem.");
+            movingSpy.wait();
+        }
+
+        function test_no_pressAndHold_when_swiped() {
+            var item = findChild(listView, "listItem0");
+            pressAndHoldSpy.target = item;
+            pressAndHoldSpy.clear();
+            movingSpy.target = item;
+            flick(item, centerOf(item).x, centerOf(item).y, units.gu(20), 0);
+            movingSpy.wait();
+
+            // press and hold
+            movingSpy.clear();
+            mouseLongPress(item.contentItem, 1, 1);
+            mouseRelease(item.contentItem, 1, 1);
+            mouseRelease(item.contentItem, 1, 1);
+            compare(pressAndHoldSpy.count, 0, "No pressAndHold() should be emitted on a swiped in ListItem.");
+            movingSpy.wait();
+        }
+
         function test_mouse_click_on_listitem() {
             var listItem = findChild(listView, "listItem0");
             verify(listItem, "Cannot find listItem0");
@@ -279,9 +316,9 @@
                 mouseMove(listItem, listItem.width / 2, dy);
             }
             compare(listItem.highlighted, false, "Item is highlighted still!");
-            mouseRelease(listItem, listItem.width / 2, dy);
-            // dismiss
-            rebound(listItem);
+            // cleanup, simulate drop event
+            mouseRelease(listItem, listItem.width / 2, dy);
+            mouseRelease(listItem, listItem.width / 2, dy);
         }
         function test_touch_click_on_listitem() {
             var listItem = findChild(listView, "listItem0");
@@ -298,16 +335,18 @@
             compare(listItem.highlighted, false, "Item is highlighted still!");
             // cleanup, wait few milliseconds to avoid dbl-click collision
             TestExtras.touchRelease(0, listItem, Qt.point(listItem.width / 2, dy));
-            // dismiss
-            rebound(listItem);
+            TestExtras.touchRelease(0, listItem, Qt.point(listItem.width / 2, dy));
+            wait(400);
         }
 
         function test_background_height_change_on_divider_visible() {
             // make sure the testItem's divider is shown
             testItem.divider.visible = true;
-            verify(testItem.contentItem.height < testItem.height, "ListItem's background height must be less than the item itself.");
+            var margins = testItem.contentItem.anchors.topMargin + testItem.contentItem.anchors.bottomMargin;
+            compare(testItem.contentItem.height, testItem.height - margins - testItem.divider.height, "ListItem's background height must be less than the item itself.");
             testItem.divider.visible = false;
-            compare(testItem.contentItem.height, testItem.height, "ListItem's background height must be the same as the item itself.");
+            waitForRendering(testItem.contentItem);
+            compare(testItem.contentItem.height, testItem.height - margins, "ListItem's background height must be the same as the item itself.");
             testItem.divider.visible = true;
         }
 
@@ -386,16 +425,13 @@
             }
             movingSpy.wait();
             // animation should no longer be running!
-            verify(!data.item.__styleInstance.snapAnimation.running, "Animation is still running!");
             compare(listView.interactive, true, "The ListView is still non-interactive!");
             compare(interactiveSpy.count, 2, "Less/more times changed!");
             // check if it snapped in
             verify(data.item.contentItem.x != 0.0, "Not snapped in!!");
             // dismiss
             rebound(data.clickOn, data.item);
-            // animation should no longer be running!
-            verify(!data.item.__styleInstance.snapAnimation.running, "Animation is still running!");
-            fuzzyCompare(data.item.contentItem.x, 0.0, 0.1, "Not snapped out!!");
+            fuzzyCompare(data.item.contentItem.x, data.item.contentItem.anchors.leftMargin, 0.1, "Not snapped out!!");
         }
 
         function test_visualized_actions_data() {
@@ -422,6 +458,26 @@
             rebound(data.item);
         }
 
+        function test_listitem_margins_data() {
+            var item = findChild(listView, "listItem1");
+            return [
+                {tag: "leading", item: item, dx: units.gu(10), leading: true},
+                {tag: "trailing", item: item, dx: -units.gu(10), leading: false}
+            ];
+        }
+        function test_listitem_margins(data) {
+            data.item.contentItem.anchors.margins = units.gu(1);
+            movingSpy.target = data.item;
+            flick(data.item, centerOf(data.item).x, centerOf(data.item).y, data.dx, 0);
+            movingSpy.wait();
+            var panel = panelItem(data.item, data.leading);
+            verify(panel && panel.visible, "Panel not visible.");
+            // cleanup
+            rebound(data.item);
+            compare(data.item.contentItem.x, units.gu(1), "contentItem.x differs from margin");
+            data.item.contentItem.anchors.margins = 0;
+        }
+
         function test_selecting_action_rebounds_data() {
             var item0 = findChild(listView, "listItem0");
             return [
@@ -452,7 +508,7 @@
                 TestExtras.touchClick(0, selectedAction, centerOf(selectedAction));
             }
             movingSpy.wait();
-            fuzzyCompare(data.item.contentItem.x, 0.0, 0.1, "Content not snapped out");
+            fuzzyCompare(data.item.contentItem.x, data.item.contentItem.anchors.leftMargin, 0.1, "Content not snapped out");
         }
 
         function test_custom_trailing_delegate() {
@@ -494,14 +550,14 @@
                 // cleanup
                 rebound(data.item);
             } else {
-                tryCompareFunction(function() { return data.item.contentItem.x; }, 0.0, 1000, "Not snapped back");
+                tryCompareFunction(function() { return data.item.contentItem.x; }, data.item.contentItem.anchors.leftMargin, 1000, "Not snapped back");
             }
         }
 
         function test_snap_gesture_data() {
             var listItem = findChild(listView, "listItem0");
-            var front = Qt.point(units.gu(1), listItem.height / 2);
-            var rear = Qt.point(listItem.width - units.gu(1), listItem.height / 2);
+            var front = Qt.point(listItem.contentItem.anchors.leftMargin + units.gu(1), listItem.height / 2);
+            var rear = Qt.point(listItem.width - (listItem.contentItem.anchors.rightMargin + units.gu(1)), listItem.height / 2);
             return [
                 // the first dx must be big enough to drag the panel in, it is always the last dx value
                 // which decides the snap direction
@@ -531,7 +587,7 @@
                 // dismiss
                 rebound(data.item);
             } else {
-                fuzzyCompare(data.item.contentItem.x, 0.0, 0.1, "Not snapped out!");
+                fuzzyCompare(data.item.contentItem.x, data.item.contentItem.anchors.leftMargin, 0.1, "Not snapped out!");
             }
         }
 
@@ -596,9 +652,9 @@
         function test_verify_action_value(data) {
             // tug actions in
             movingSpy.target = data.item;
-            flick(data.item, centerOf(data.item).x, centerOf(data.item).y, units.gu(20), 0, 100, 10);
+            flick(data.item, centerOf(data.item).x, centerOf(data.item).y, units.gu(20), 0);
             movingSpy.wait();
-            verify(data.item.contentItem.x != 0.0, "Not snapped in");
+            verify(data.item.contentItem.x != data.item.contentItem.anchors.leftMargin, "Not snapped in");
 
             var panel = panelItem(data.item, "Leading");
             var action = findChild(panel, "leading_2");
@@ -607,9 +663,7 @@
             actionSpy.target = data.item.leadingActions.actions[1];
 
             // select the action
-            movingSpy.clear();
             mouseClick(action, centerOf(action).x, centerOf(action).y);
-            movingSpy.wait();
 
             // check the action param
             actionSpy.wait();