Adding multiple image views inside a UIScrollView with Paging enabled YES

[James Lieu]

Hi I'm new to RubyMotion and I'm having trouble solving this problem. I'm trying to create a step by step guide by using a series of 3 images which you can scroll across, I've googled it and the best way to do this is with UIScrollView and setting pagingEnabled = YES

This is how it was done in objective C. Though I'm having trouble translating it into the app I'm building. Please help.

    -(void) setupScrollView {

        //add the scrollview to the view

       self.scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 

                                               self.view.frame.size.width, 

                                               self.view.frame.size.height)];

       self.scrollView.pagingEnabled = YES;

       [self.scrollView setAlwaysBounceVertical:NO];

        //setup internal views

       NSInteger numberOfViews = 3;

       for (int i = 0; i < numberOfViews; i++) {

          CGFloat xOrigin = i * self.view.frame.size.width;

          UIImageView *image = [[UIImageView alloc] initWithFrame:

                                                    CGRectMake(xOrigin, 0, 

                                                    self.view.frame.size.width, 

                                                    self.view.frame.size.height)];

          image.image = [UIImage imageNamed:[NSString stringWithFormat:

                                            @"image_%d", i+1]];

          image.contentMode = UIViewContentModeScaleAspectFit;

          [self.scrollView addSubview:image];

        }

        //set the scroll view content size

       self.scrollView.contentSize = CGSizeMake(self.view.frame.size.width * 

                                                numberOfViews, 

                                                self.view.frame.size.height);

        //add the scrollview to this view

       [self.view addSubview:self.scrollView];

    }

Kind regards,

James

[Dennis Major]

I have need for this code myself so I'll convert it to RM and post it here but it will have to be tomorrow sometime.

[James Lieu]

This is what I have so far, it doesn't work. Can anyone find whats what with it?

  def loadView

    self.view = UIScrollView.alloc.initWithFrame(CGRectMake(0, 0, 

                                               self.view.frame.size.width, 

                                               self.view.frame.size.height))

  end

  def viewDidLoad

    super

    self.view.backgroundColor = UIColor.whiteColor

    self.title = "Instructions"    

    self.pagingEnabled = true

@photos = [UIImage.imageNamed('background.png'), UIImage.imageNamed('background_2.png')]

  

    i = 0

    @photos.each do |image|

      imageView = UIImageView.alloc.initWithImage(image)

      imageView.contentMode = UIViewContentModeScaleAspectFit

      imageView.clipsToBounds = true

    imageView.frame = CGRectMake(960 * i += 1, 0, 960, self.view.frame.size.height)

    self.addSubview(imageView)

    imageView.release

  end

    self.contentSize = CGSizeMake(960*i, 640);

    self.delegate = self; 

end

end

kind regards

[GantMan]

Paginated Scrollview

https://github.com/IconoclastLabs/rubymotion_cookbook/tree/master/ch_2/18_scrollview

[Dennis Major]

James,

The following code works for me:

class KWHelpScrollView < UIViewController

  attr_accessor(:scrollView)

  def initWithNibName(nibNameOrNil, bundle:nibBundleOrNil)

    if super

      self

    else

      nil

    end

  end

  def viewDidLoad

    super

  end

  def viewWillAppear(animated)

    super

    setupScrollView

    self.view.addSubview(self.scrollView)

  end

  def setupScrollView

    #add the scrollview to the view

    self.scrollView = UIScrollView.alloc.initWithFrame(CGRectMake(0, 0, self.view.frame.size.width,

                                                       self.view.frame.size.height))

    self.scrollView.pagingEnabled = true

    self.scrollView.setAlwaysBounceVertical(false)

    #setup internal views

    numberOfViews = 3

    for i in 1..numberOfViews

      xOrigin = i * self.view.frame.size.width

      image = UIImageView.alloc.initWithFrame(CGRectMake(xOrigin, 0,self.view.frame.size.width,self.view.frame.size.height))

      the_image_string = "image_#{i}.jpg"

      image.image = UIImage.imageNamed(the_image_string)

      image.contentMode = UIViewContentModeScaleAspectFit

      self.scrollView.addSubview(image)

     end

    #set the scroll view content size

    self.scrollView.contentSize = CGSizeMake((self.view.frame.size.width * numberOfViews), self.view.frame.size.height)

    end

end

On Wednesday, 30 October 2013 09:06:41 UTC-4, James Lieu wrote:

This is what I have so far, it doesn't work. Can anyone find whats what with it?

  def loadView

    self.view = UIScrollView.alloc.initWithFrame(CGRectMake(0, 0, James 

[Dennis Major]

A slight change to the code I posted - the last image was not scrollable so I changed the for loop as follows: for i in 0..(numberOfViews - 1) and my images are labelled 0 to 2.

    for i in 0..(numberOfViews - 1)

[James Lieu]

It Works! Thank you so much!