feat(slides): support centering slides and using decimal numbers

Closes #10361
ionic-team · Jun 5, 2017 · e3c60c5 · e3c60c5
1 parent f5bbdcd
commit e3c60c5
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 6 deletions.
diff --git a/src/components/slides/slides.ts b/src/components/slides/slides.ts
@@ -365,10 +365,22 @@ export class Slides extends Ion {
     return this._slidesPerView;
   }
   set slidesPerView(val: any) {
-    this._slidesPerView = val === 'auto' ? 'auto' : parseInt(val, 10);
+    this._slidesPerView = val === 'auto' ? 'auto' : parseFloat(val);
   }
   private _slidesPerView: number|string = 1;
 
+  /** 
+   * @input {boolean} Center a slide in the middle of the screen.
+   */
+  @Input()
+  get centeredSlides() {
+    return this._centeredSlides;
+  }
+  set centeredSlides(val: boolean) {
+    this._centeredSlides = isTrueProperty(val);
+  }
+  private _centeredSlides: boolean = false;
+
   /**
    * @hidden
    */
@@ -381,10 +393,6 @@ export class Slides extends Ion {
    * @hidden
    */
   slidesPerGroup = 1;
-  /**
-   * @hidden
-   */
-  centeredSlides = false;
   /**
    * @hidden
    */

diff --git a/src/components/slides/test/options/main.html b/src/components/slides/test/options/main.html
@@ -5,7 +5,8 @@
             (ionSlideDrag)="onSlideDrag($event)"
             pager="true"
             effect="slide"
-            slidesPerView="2"
+            slidesPerView="2.1"
+            centeredSlides="true"
             spaceBetween="40">
 
   <ion-slide style="background: red; color: white;">