I have three UIButtons and a holder UIView I want all my three UIButton to be vertically centred inside the UIView and also I want them to be distributed equal horizontally
float ycentre = CGRectGetMidY(self.buttonHolderView.bounds);
float xposition = (self.buttonHolderView.frame.size.width - 135.0f)/4.0f;
self.button1 = [[UIButton alloc]initWithFrame:CGRectMake(xposition,0, 45, 30)];
self.button1.center = CGPointMake(self.button1.frame.origin.x, ycentre);
self.button2 = [[UIButton alloc]initWithFrame:CGRectMake((xposition*2)+45,0, 45, 30)];
self.button2.center = CGPointMake(self.button2.frame.origin.x, ycentre);
self.button3 = [[UIButton alloc]initWithFrame:CGRectMake((xposition*3)+90,0, 45, 30)];
self.button3.center = CGPointMake(self.button3.frame.origin.x, ycentre);
[self.button3 addTarget:self action:#selector(ShareButtonClicked) forControlEvents:UIControlEventTouchUpInside];
[self.buttonHolderView addSubview:self.button1];
[self.buttonHolderView addSubview:self.button2];
[self.buttonHolderView addSubview:self.button3];
Each button has height 30 and width 45 , but my code doesn't distribute them equally what is wrong?
Place them in a UIStackView. It makes spacing views evenly quite easy.
Set the frame of your buttons as follows and do Not set center
float thirdOfWidth = (self.buttonHolderView.frame.width/3.0);
float buttonWidth = 45.0;
float buttonHeight = 30.0;
self.button1 = [[UIButton alloc]initWithFrame:CGRectMake(thirdOfWidth*0 + (thirdOfWidth - buttonWidth)/2, (self.buttonHolderView.frame.height - buttonHeight)/2, 45, 30)];
self.button2 = [[UIButton alloc]initWithFrame:CGRectMake(thirdOfWidth*1 + (thirdOfWidth - buttonWidth)/2, (self.buttonHolderView.frame.height - buttonHeight)/2, 45, 30)];
self.button3 = [[UIButton alloc]initWithFrame:CGRectMake(thirdOfWidth*2 + (thirdOfWidth - buttonWidth)/2, (self.buttonHolderView.frame.height - buttonHeight)/2, 45, 30)];
It can be done also in loop with arbitrary count of buttons
NSInteger count = 3;
CGFloat buttonWidth = 45;
CGFloat buttonHeight = 30;
CGFloat x = (self.bounds.size.width - buttonWidth) / 2;
CGFloat verticalSpacing = ((self.bounds.size.height - buttonHeight * count) / count) - buttonHeight / 2;
CGFloat y = verticalSpacing;
for (int i = 0; i < count; i++) {
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(x, y, buttonWidth, buttonHeight)];
[self addSubview:button];
y += buttonHeight + verticalSpacing;
}
Related
Currently I am displaying a list of items to choose from, the scrollview scrolls to the bottom, however, it goes 'under' the GUI/Banner, whereas I would prefer the scrollview to stop displaying beyond that point - the user should still be able to keep scrolling but the scrollview should not overlap the bottom if that makes sense?
At the moment the scrollview takes up the whole screen.
- (void)reloadScroll
{
for(UIView *view in [scroll subviews])
[view removeFromSuperview];
scroll.contentSize = CGSizeMake(scroll.frame.size.width, 1760);
for(int i = 0; i < 20; i++)
{
int xCoord = 0;
if(i % 2 == 0)
xCoord = 57;
else
xCoord = 188;
UIButton *glasss = [[UIButton alloc] initWithFrame:CGRectMake(xCoord, 20 + i/2 * 150 + i/2 * 20, 75, 150)];
if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
{
int xCoord = 0;
if(i % 2 == 0)
xCoord = 156;
else
xCoord = 462;
glasss.frame = CGRectMake(xCoord, 20 + i/2 * 300 + i/2 * 20, 150, 300);
scroll.contentSize = CGSizeMake(scroll.frame.size.width, 3240);
}
}
i want to display some images on album cover on my app like bellow image.
EDIT:-
i want to display this view in UICollectionViewCell and collectionView scrollDirection Horizontal with paging enabled.
any help will be appreciated. and thanks in advance.
I do not know if you understand the question correctly.
If you want to do what I see on the picture, so try this:
UIView *cover = [[UIView alloc] initWithFrame:CGRectMake(100, 100, 500, 500)];
cover.backgroundColor = [UIColor blueColor];
int width = 200;
int height = 350;
int posx = 100;
int posy = 50;
for (int i = 0; i < 10; i++) {
//craete images
UIView *imagebg = [[UIView alloc] initWithFrame:CGRectMake(posx + arc4random_uniform(20), posy + arc4random_uniform(20), width, height)];
imagebg.backgroundColor = [UIColor whiteColor];
UIImageView *image = [[UIImageView alloc] initWithFrame:CGRectMake(20, 20, width - 40, height - 50)];
image.image = [UIImage imageNamed:#"loading-screen.png"];
[imagebg addSubview:image];
//rotate
double rads = arc4random_uniform(100)/10;
CGAffineTransform transform = CGAffineTransformRotate(imagebg.transform, rads);
imagebg.transform = transform;
//add as subview
[cover addSubview:imagebg];
}
[self.view addSubview:cover];
I know there is alot of documentation on this topic, and from what i've read i've learned a lot. My issue here is that i began creating a custom UIView within a viewcontroller & now when i'm trying to make it the UIView its own class, so as to be called & used within a working app, i'm pretty confused as to what i need to do to achieve it.
The overall aim of the class is to be able to select a button one a view controller, which will instantiate the custom view, then display. The visual effect for the user is that they click the button, then a window will animate-appear from the bounds of the button (although the code below uses the positioning of top left currently), then display a combination of switches & labels, along with a back & save button.
You can see from my code that what i need to achieve this process, i've managed to implement into a single function (again, this was from creating it within a viewcontroller). What i'm after now, and can't quite fathom out is for the custom view to be imported, then on the action of the main view controller's button, add the view to self.view.
- (void)makeBox{
//view bounds
CGFloat viewWidth = CGRectGetWidth(self.view.frame);
CGFloat viewHeight = CGRectGetHeight(self.view.frame);
//red box x, y & size
CGFloat startx = (viewWidth / 100) * 10;
CGFloat starty = (viewHeight /100) * 20;
CGFloat width = (viewWidth / 100) * 80;
CGFloat height = (viewHeight /100) * 70;
CGRect view1Frame = CGRectMake(startx, starty, width, height);
//label & switch frame
CGRect labelMR = CGRectMake(10, ((height / 100) * 12), ((width / 100) * 80) - 7.5, 25);
CGRect switchMR = CGRectMake(((width / 100) * 80) + 7.5, ((height / 100) * 11), ((width / 100) * 10), 15);
//this is repeated for 6 other labels & switches
CGRect backButtonR = CGRectMake(5, 5, 50, 35);
CGRect saveButtonR = CGRectMake((width - 50), 5, 50, 35);
if (!self.view1) {
self.switchM = [[UISwitch alloc] initWithFrame:switchMR];
self.switchM.tag = 10;
if(self.monday){ //self.monday refers to a BOOL property of the viewcontroller that this was originally made in
self.switchM.on = true;
} else{
self.switchM.on = false;
}
[self.switchM addTarget:self action:#selector(switched:) forControlEvents:UIControlEventTouchUpInside];
// this switch instantiation process is repeated 6 other times
self.backButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[self.backButton addTarget:self
action:#selector(hideBox)
forControlEvents:UIControlEventTouchUpInside];
[self.backButton setTitle:#"Back" forState:UIControlStateNormal];
self.backButton.frame = backButtonR;
self.saveButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[self.saveButton addTarget:self
action:#selector(daysChanged)
forControlEvents:UIControlEventTouchUpInside];
[self.saveButton setTitle:#"Save" forState:UIControlStateNormal];
self.saveButton.frame = saveButtonR;
self.labelM = [[UILabel alloc] initWithFrame:labelMR];
self.labelM.layer.masksToBounds = YES;
self.labelM.layer.cornerRadius = 5;
self.labelM.layer.borderColor = [UIColor blackColor].CGColor;
self.labelM.layer.borderWidth = .5;
self.labelM.text = #" Monday";
self.labelM.backgroundColor = [UIColor whiteColor];
//again - repeated 6 times
//use this starting frame to make the 'popover' appear small at first
CGRect startFrame = CGRectMake(10, 10, 10, 10);
self.view1 = [[UIView alloc] initWithFrame:startFrame];
[self.view addSubview:self.view1];
[UIView animateWithDuration:0.5 animations:^(void){
self.view1.layer.cornerRadius = 10;
self.view1.layer.borderColor = [UIColor blackColor].CGColor;
self.view1.layer.borderWidth = .5;
[self.view1 setBackgroundColor:[UIColor lightGrayColor]];
self.view1.frame = view1Frame;
} completion:^(BOOL finished){
[self.view1 addSubview:self.labelM];
[self.view1 addSubview:self.switchM];
//repeat 6 times for other labels & switches
}];
}
else {
[UIView animateWithDuration:0.3 animations:^() {
self.view1.frame = view1Frame;
} completion:^(BOOL finished) {
self.labelM.frame = labelMR;
self.switchM.frame = switchMR;
//repeated for the other 6
self.backButton.frame = backButtonR;
self.saveButton.frame = saveButtonR;
}];
}
}
-(void) hideBox{
//back button was selected
[UIView animateWithDuration:0.5 animations:^(void){
[self.view1 removeFromSuperview];
self.view1 = nil;
}];
}
I understand that as i'm doing/calling this via code, i need to override either init or initWithFrame:. Do i pass the initWithFrame: the containing view controllers bounds, of which the custom view can be calculated on, and how do i handle the animation?
I've managed to set up the delegate protocol which will notify when the save button is pressed. that part i understand, its just the rest of the parts i'm unclear on.
First some background.
Typically for a popover controller, you have a single transparent root view which contains the popover view itself. This root view is the size of the containing window and usually higher in z-order than all other views. There are two reasons for this:
1) The popover needs to draw on top of all other views. If the root view wasn't on top of all other views, the popover could be clipped and not draw all of its contents.
2) The user usually needs some place to tap and dismiss the popover (effectively a cancel action).
UIPopoverController does this as do some 3rd party popovers. Some even go so far as to use their own UIWindows.
To answer your specific questions:
1) initWithFrame: / setFrame: should be passed a CGRect that is in the coordinate space of the view that will contain the view. In other words, the superview. If you decide to use a transparent root view, the popover (the part that draw on screen) will be passed a CGRect in the coordinate space of the transparent root view.
2) Usually a popover is animated like so:
// set initial frame
popover.frame = CGRectMake(x, y, width, 0);
popover.alpha = 0.0;
[rootView addSubview:popover];
[UIView animateWithDuration:0.5
animations:^{
CGRect frame = popover.frame;
frame.size.height = some-height;
popover.frame = frame;
popover.alpha = 1;
}
];
I actually got it to work! (although i can't promise this is the cleanest or most resourceful way - we'll work on that).
Here's what i did:
Split the makeBox function into 3 function, initWithWidth:andHeight:forView, openBox & updateBoxWithWidth:andHeight.
I used a saveButton delegate method that informs the parent that save button has been pressed.
.h
#protocol BoxDelegate
-(void) daysChanged;
#end
__weak id <BoxDelegate> delegate;
#interface aBox : UIView
#property (nonatomic) BOOL monday;
#property (nonatomic, weak) id <BoxDelegate> delegate;
//property values for the custom view
-(id) initWithWidth: (CGFloat) width andHeight: (CGFloat) height withView: (UIView*) theView;
-(void) updateViewWithWidth: (CGFloat) width andHeight: (CGFloat) height;
-(void) openBox;
#end
.m
#synthesize delegate;
-(id) initWithWidth:(CGFloat)inWidth andHeight:(CGFloat)inHeight withView: (UIView*) theView{
self = [super init];
self.mainView = theView;
//super view bounds
self.viewWidth = inWidth;
self.viewHeight = inHeight;
//red box x, y & size
CGFloat startx = (self.viewWidth / 100) * 10;
CGFloat starty = (self.viewHeight /100) * 20;
self.width = (self.viewWidth / 100) * 80;
self.height = (self.viewHeight /100) * 70;
self.view1Frame = CGRectMake(startx, starty, self.width, self.height);
//label & switch frame
self.labelMR = CGRectMake(10, ((self.height / 100) * 12), ((self.width / 100) * 80) - 7.5, 25);
self.switchMR = CGRectMake(((self.width / 100) * 80) + 7.5, ((self.height / 100) * 11), ((self.width / 100) * 10), 15);
//repeated for the other 6
self.backButtonR = CGRectMake(5, 5, 50, 35);
self.saveButtonR = CGRectMake((self.width - 50), 5, 50, 35);
self.switchM = [[UISwitch alloc] initWithFrame:self.switchMR];
self.switchM.tag = 10;
if(self.monday){
self.switchM.on = true;
} else{
self.switchM.on = false;
}
[self.switchM addTarget:self action:#selector(switched:) forControlEvents:UIControlEventTouchUpInside];
self.labelM = [[UILabel alloc] initWithFrame:self.labelMR];
self.labelM.layer.masksToBounds = YES;
self.labelM.layer.cornerRadius = 5;
self.labelM.layer.borderColor = [UIColor blackColor].CGColor;
self.labelM.layer.borderWidth = .5;
self.labelM.text = #" Monday";
self.labelM.backgroundColor = [UIColor whiteColor];
//repeated for the other 6
self.saveButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[self.saveButton addTarget:delegate
action:#selector(daysChanged)
forControlEvents:UIControlEventTouchUpInside];
[self.saveButton setTitle:#"Save" forState:UIControlStateNormal];
self.saveButton.frame = self.saveButtonR;
return self;
}
-(void) openBox{
CGRect startFrame = CGRectMake(10, 10, 10, 10);
self.view1 = [[UIView alloc] initWithFrame:startFrame];
[self.mainView addSubview:self.view1];
[UIView animateWithDuration:0.5 animations:^(void){
self.view1.layer.cornerRadius = 10;
self.view1.layer.borderColor = [UIColor blackColor].CGColor;
self.view1.layer.borderWidth = .5;
[self.view1 setBackgroundColor:[UIColor lightGrayColor]];
// repeated for the other 6
self.view1.frame = self.view1Frame;
} completion:^(BOOL finished){
[self.view1 addSubview:self.labelM];
[self.view1 addSubview:self.switchM];
[self.view1 addSubview:self.backButton];
[self.view1 addSubview:self.saveButton];
}];
}
-(void) updateViewWithWidth: (CGFloat) width andHeight:(CGFloat) height{
//re-calculate
self.viewWidth = width;
self.viewHeight = height;
CGFloat startx = (self.viewWidth / 100) * 10;
CGFloat starty = (self.viewHeight /100) * 20;
self.width = (self.viewWidth / 100) * 80;
self.height = (self.viewHeight /100) * 70;
self.view1Frame = CGRectMake(startx, starty, self.width, self.height);
//label & switch frame
self.labelMR = CGRectMake(10, ((self.height / 100) * 12), ((self.width / 100) * 80) - 7.5, 25);
self.switchMR = CGRectMake(((self.width / 100) * 80) + 7.5, ((self.height / 100) * 11), ((self.width / 100) * 10), 15);
self.backButtonR = CGRectMake(5, 5, 50, 35);
self.saveButtonR = CGRectMake((self.width - 50), 5, 50, 35);
[UIView animateWithDuration:0.3 animations:^() {
self.view1.frame = self.view1Frame;
} completion:^(BOOL finished) {
self.labelM.frame = self.labelMR;
self.switchM.frame = self.switchMR;
self.backButton.frame = self.backButtonR;
self.saveButton.frame = self.saveButtonR;
}];
}
And then in our parent viewcontroller
#property aBox *theBox;
...
- (void)viewDidLoad {
[super viewDidLoad];
self.theBox = [[aBox alloc] initWithWidth:self.view.frame.size.width andHeight:self.view.frame.size.height withView:self.view];
[self.theBox openBox];
}
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation{
[self.theBox updateViewWithWidth:self.view.frame.size.width andHeight:self.view.frame.size.height];
}
- (void) daysChanged{
NSLog(#"Days Changed!");
}
I'm making a circle with different buttons all over, spaced out at equal intervals.
Here's what it looks like :
I want to make it so that the picture doesn't rotate. How do I achieve that ? Here's the code.
- (void)drawWheel
{
// Drawing the Wheel view
wheelView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 275, 275)];
wheelView.center = self.view.center;
wheelView.layer.cornerRadius = wheelView.frame.size.width / 2.0;
wheelView.layer.borderColor = [UIColor whiteColor].CGColor;
//wheelView.layer.borderWidth = 0.5f;
CGFloat angleSize = 2 * M_PI / self.buttons.count;
for(int i = 0; i < self.buttons.count; i++)
{
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, wheelView.frame.size.width / 2.0, 40)];
label.layer.anchorPoint = CGPointMake(1.0f, 0.5f);
label.layer.position = CGPointMake(wheelView.bounds.size.width / 2.0, wheelView.bounds.size.height / 2.0);
label.transform = CGAffineTransformMakeRotation(angleSize * i);
label.backgroundColor = [UIColor clearColor];
UIButton *button = [self.buttons objectAtIndex:i];
button.center = CGPointMake(label.center.x, label.center.y + 15);
button.transform = CGAffineTransformRotate(label.transform, 2 * (angleSize * i));
[label addSubview:button];
[wheelView addSubview:label];
}
[self.view addSubview:wheelView];
}
I didn't check it, but could you change following code
button.transform = CGAffineTransformRotate(label.transform, 2 * (angleSize * i));
to
button.transform = CGAffineTransformMakeRotation(-1 * angleSize * i);
Here I am just rotating your button to opposite direction
You could do something like this I think...
- (void)drawWheel
{
// Drawing the Wheel view
wheelView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 275, 275)];
wheelView.center = self.view.center;
wheelView.layer.cornerRadius = wheelView.frame.size.width / 2.0;
wheelView.layer.borderColor = [UIColor whiteColor].CGColor;
//wheelView.layer.borderWidth = 0.5f;
CGFloat angleSize = 2 * M_PI / self.buttons.count;
for(int i = 0; i < self.buttons.count; i++)
{
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, wheelView.frame.size.width / 2.0, 40)];
label.layer.anchorPoint = CGPointMake(1.0f, 0.5f);
label.layer.position = CGPointMake(wheelView.bounds.size.width / 2.0, wheelView.bounds.size.height / 2.0);
label.transform = CGAffineTransformMakeRotation(angleSize * i);
label.backgroundColor = [UIColor clearColor];
UIButton *button = [self.buttons objectAtIndex:i];
button.center = CGPointMake(label.center.x, label.center.y + 15);
// change this line
button.transform = CGAffineTransformMakeRotation(-angleSize * i);
[label addSubview:button];
[wheelView addSubview:label];
}
[self.view addSubview:wheelView];
}
Here I am just transforming the button in the other direction with the same angle.
i.e. if the label is rotated 35 degrees then the button is rotated -35 degrees. This will mean the button is rotated 0 degrees relative to the sup review of the label.
I want to create 15 UIButtons progaramatically using for loop. I want to arrange buttons like matrix with rows and colums, say 3 rows and 5 columns. The buttons height is 50 and width is 80. I can set y,width,height coordinates. But I face problem only with x coordinate. Tell me the logic for setting x coordinate.
Thanks in advance.
float x = 10;
float y = 10;
float width = 50;
float height = 50;
for(int i =0;i<15;i++)
{
UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[btn setFrame:CGRectMake(x, y, width, height)];
[btn setTitle:[NSString stringWithFormat:#"B%d",i+1] forState:UIControlStateNormal];
[self.view addSubview:btn];
x = x + width + 20;
if((i+1)%3==0)
{
x = 10;
y = y + height + 20;
}
}
Just replace x and y and also set height and width in above code.
int row = 0;
int column = 0;
for (int i = 0; i < 15; i++)
{
if((row%3 == 0) && (row > 0))
{
row = 0;
column++;
}
else{
row++;
}
CGRect btnFrame = CGRectMake(row*80+10, column*50+10, 80, 50);//your button frame
UIButton *btnTemp = [UIButton buttonWithType:UIButtonTypeCustom];
[btnTemp setFrame:btnFrame];
[self.view addSubView:btnTemp];
}
Here you go:
CGFloat marginX = 10.f;
CGFloat marginY = 5.f;
CGRect buttonFrame = CGRectMake(0., 0., 80., 50.f);
for(NSUInteger row = 0; row < 5; row++) {
for(NSUInteger column = 0; column < 3; column++) {
UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
button.frame = buttonFrame;
//... more button settings
[self.view addSubview:button];
buttonFrame.origin.x += marginX;
}
buttonFrame.origin.x = 0.;
buttonFrame.origin.y += marginY;
}