0

I am working programmatically an application for iOS based on a ViewController. I am trying to do so programmatically as I want to understand the underlying concepts.

I have created a subclass of UIImageView and initialized this using an image. In the initialization method I added also a second UIImageView as I would like to handle the two differently but be part of the same object. Ultimately I would like to be able to scale the object (and hence the 2 UIImages) according to the device screen resolution (e.g. if resolution is low then I will scale the two images by 50%). I want to do this because I would like to be able to implement a zoom in and zoom out feature as well as supporting multiple resolutions and screen layouts.

Additional information:

  • The two images have different size (500x500 pixels) and (350x350 pixels).

My questions are:

  • how do I position the second image exactly in the center of the first? (I used the center property of the main UIImage but I think I got it wrong.. I thought that the center was the exact center of the square but either I am using it incorrectly or there is something I am missing)
  • are there any negative side effects for using this approach (UIView subclass class containing an additional UIView?) (E.g. Is it going to create confusion when applying transformation algorithms? Does it reduce the randering speed? Or more simply is it a bad design pattern?)

here is a little example of how it should look like..

I find it difficult to understand the positioning of the second image. See code snipped below, this is what I use:

    CGRect innerButtonFrame = CGRectMake(self.center.x/2, self.center.y/2,innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);

Taken from:

-(id) initWithImage:(UIImage *)image
{
    if(self = [super initWithImage:image]){
        //
        self.userInteractionEnabled = true;

        // Initialize gesture recognizers
        UITapGestureRecognizer *tapInView = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapInImageView:)];
        [self addGestureRecognizer:tapInView];

        UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longPressInView:)];
        [self addGestureRecognizer:longPress];


        // Initialize labels
        ..

        // Inner circle image
        innerButtonView = [[UIImageView alloc] init];
        innerButtonSelectedImage = [UIImage imageNamed:@"inner circle.png"];

        CGRect innerButtonFrame = CGRectMake(self.center.x/2, self.center.y/2,innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);

        innerButtonView.frame = innerButtonFrame;
        [innerButtonView setImage:innerButtonSelectedImage];

        // Add additional ui components to view
        [self addSubview:innerButtonView];
        .. 
        [self addSubview:descriptionLabel];
    }
    return self;
}

EDIT: This is how it looks like if I change the positioning code to the following:

CGRect innerButtonFrame = CGRectMake(0, 0,innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);

        innerButtonView.frame = innerButtonFrame;

I also don't understand why the image is bigger than the screen.. as the blue one should be 500x500 pixel wide and the screen of the iPhone 6 should be 1334 x 750.

enter image description here

mm24
  • 9,280
  • 12
  • 75
  • 170
  • Understand the differences between frame, bounds and center. See http://stackoverflow.com/questions/5361369/uiview-frame-bounds-and-center – ahwulf Dec 12 '14 at 14:10

2 Answers2

0

How about:

CGRect innerButtonFrame = CGRectMake(0, 0, innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);
innerButtonFrame.center = self.center;
koen
  • 5,383
  • 7
  • 50
  • 89
0

If you need 500*500 circle then add the circle half means Replace 500*500 with 250*250 . And small circle replace 350*350 with 175*175 And solve your problem.

I hope your problem will solve..Enjoy

Thanks..

Milan patel
  • 223
  • 2
  • 15