Added contentWidth to decide where text wraps

2 files changed, 25 insertions, 6 deletions

diff --git a/Qt/labs/presentation/Slide.qml b/Qt/labs/presentation/Slide.qml
index 0c2dd9e..738e00e 100644
--- a/Qt/labs/presentation/Slide.qml
+++ b/Qt/labs/presentation/Slide.qml
@@ -16,6 +16,8 @@ Item {
     property real titleFontSize: fontSize * 1.2 * fontScale
     property real bulletSpacing: 1
 
+    property real contentWidth: width
+
     // Define the slide to be the "content area"
     x: parent.width * 0.05
     y: parent.height * 0.2
@@ -67,7 +69,7 @@ Item {
                 property real indentFactor: (10 - row.indentLevel * 2) / 10;
 
                 height: text.height + (nextIndentLevel == 0 ? 1 : 0.3) * slide.baseFontSize * slide.bulletSpacing
-                x: 50 * indentLevel
+                x: slide.baseFontSize * indentLevel
 
                 Rectangle {
                     id: dot
@@ -89,7 +91,7 @@ Item {
 
                 Text {
                     id: text
-                    width: slide.width
+                    width: slide.contentWidth - parent.x - dot.width - space.width
                     font.pixelSize: baseFontSize * row.indentFactor
                     text: content[index]
                     textFormat: Text.PlainText
diff --git a/examples/helloprezo/SlideDeck.qml b/examples/helloprezo/SlideDeck.qml
index 748fa14..d916f13 100644
--- a/examples/helloprezo/SlideDeck.qml
+++ b/examples/helloprezo/SlideDeck.qml
@@ -78,14 +78,11 @@ Presentation
         }
     }
 
-
     Slide {
         title: "Slide {}, continued"
         Rectangle {
             anchors.fill: parent
-
-            color: "lightgray"
-
+            color: "lightGray"
             Text {
                 text: "Slide fills this area..."
                 anchors.centerIn: parent
@@ -93,6 +90,26 @@ Presentation
         }
     }
 
+    Slide {
+        id: fillAreaSlide
+        title: "Slide {}, continued"
+        content: ["The built-in property \"contentWidth\" can be used to let the bullet points fill a smaller area of the slide..."]
+
+        SequentialAnimation on contentWidth {
+            PropertyAction { value: fillAreaSlide.width }
+            PauseAnimation { duration: 2500 }
+            NumberAnimation { to: fillAreaSlide.width / 2; duration: 5000; easing.type: Easing.InOutCubic }
+            running: fillAreaSlide.visible
+        }
+
+        Rectangle {
+            height: parent.height
+            width: parent.contentWidth
+
+            color: "lightGray"
+            z: -1
+        }
+    }
 
     Slide {
         title: "Slide {}, continued"