Create a dynamic row of UITextfields - ios

I would like some help creating a dynamic row of UITextfields, I have been trying to do it myself with some success but mostly failure.
I set a number of rows between 1 - 13 and I would like to create UITextfields that fit inside the width of an iPhone frame width evenly spaced with an even gap to the left and right.
Here is what I have done so far:
- (void) displayViews {
// add scrollview
htmlContainerScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0.0, 60.0, self.view.frame.size.width, 293.0)];
NSInteger viewcount = [axisString integerValue];
color = 200;
for(int i = 0; i< viewcount; i++) {
color = color + 20;
NSLog(#"%f", color);
CGFloat y = i * 91;
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, y,self.view.frame.size.width, 90.0)];
view.backgroundColor = [UIColor colorWithRed:0/255.0 green:0/255.0 blue:0/255.0 alpha:(1.0/i)];;
[htmlContainerScrollView addSubview:view];
int cutCount = [cutsString integerValue];
int positions = (self.view.frame.size.width/cutCount);
for (int i = 0; i < cutCount; i++) {
//first one
UITextField *cutField = [[UITextField alloc] initWithFrame:CGRectMake((positions*i)+(20/2), 25, 20, 20)];
cutField.textColor = [UIColor colorWithRed:0/256.0 green:84/256.0 blue:129/256.0 alpha:1.0];
cutField.font = [UIFont fontWithName:#"Helvetica-Bold" size:25];
cutField.backgroundColor=[UIColor whiteColor];
[view addSubview:cutField];
}
}
htmlContainerScrollView.contentSize = CGSizeMake(self.view.frame.size.width, 91 *viewcount);
[self.view addSubview:htmlContainerScrollView];
}
The biggest problem with mine is that it does not evenly space them; they are always to the left.

change your cutField's frame x coordinate value calculation from
(positions*i)+(20/2)
to
((positions*i)-(20/2)+(positions/2)).
that should do the trick.
it's just a matter of the x coordinate calculation and i am sure there is room to optimize that a bit.

Related

Display some images on album cover in iOS

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];

How to set alignment for UIScrollView in ios

i am creating an application, where i am using UIScrollView for displaying the number of available colors of each product. I am getting number of available colors at run time, so i have used for loop and displaying on my scroll view. Its working fine, but the problem if i am getting only one available color then my output is coming as below screen :
But the output should be as below screen :
It seems like i need to do kind of center alignment for my UIScrollView, so every available color will suppose to display from center. here is my code :
UIScrollView *availableColorScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 80)];
availableColorScrollView.backgroundColor = [UIColor clearColor];
availableColorScrollView.showsHorizontalScrollIndicator = YES;
availableColorScrollView.showsVerticalScrollIndicator=NO;
availableColorScrollView.pagingEnabled = YES;
for (int i = 0; i < arrayAvlbleColors.count; i++) {
CGRect frame;
frame.origin.x = 23 * i;
frame.origin.y = 0;
frame.size = availableColorScrollView.frame.size;
UIView *subview = [[UIView alloc] initWithFrame:frame];
UILabel *label = [[UILabel alloc] init];
[label setFrame:CGRectMake(15, 14, 16, 16)];
[label.layer setCornerRadius:8];
NSString *strColorCode = [arrayAvlbleColors objectAtIndex:i];
strColorCode = [strColorCode substringFromIndex:1];
[label setBackgroundColor:[self colorWithHexString:strColorCode]];
[subview addSubview:label];
[availableColorScrollView addSubview:subview];
}
[self.view addSubview:availableColorScrollView];
availableColorScrollView.contentSize = CGSizeMake(24 * arrayAvlbleColors.count, availableColorScrollView.frame.size.height);
Please suggest me to achieve my output, Thanks!
this is the simple answer but working fine if u taken any Mainview or subview or else,
set the frame size/2 for height and width it automatically set it into center of the subview.
here i used static color , customize urself
just change your line this
NSString *strColorCode = [arrayAvlbleColors objectAtIndex:i];
strColorCode = [strColorCode substringFromIndex:1];
[label setBackgroundColor:[self colorWithHexString:strColorCode]];
[subview addSubview:label];
[availableColorScrollView addSubview:subview];
into
NSString *strColorCode = [arrayAvlbleColors objectAtIndex:i];
strColorCode = [strColorCode substringFromIndex:1];
[label setBackgroundColor:[self colorWithHexString:strColorCode]];
//use any one
//option no 1:
//[label setCenter:subview.center];
//option no 2:
[ label setCenter:CGPointMake(subview.frame.size.width / 2, subview.frame.size.height / 2)];
[subview addSubview:label];
[availableColorScrollView addSubview:subview];
final out put is
You can calculate your scrollview content to be placed in centre like this:
float contentWidth = 23 * arrayAvlbleColors.count;
Now you have content width to subtract from scrollView's width
float centerPadding = 0.0f;
float width = availableColorScrollView.frame.size.width;
centerPadding = width - contentWidth;
if(centerPadding < 0)
{
//content cannot be placed in center as content is bigger than width
centerPadding = 0.0f;
}
We have padding to center our content in scrollView, so use it in for loop like this :
frame.origin.x = (23 * i) + centerPadding;

Fill view with buttons at random positions

i want to fill area (UIView) with buttons(UIButton) so that they do not intersect with each others.
My idea:
create initial button at random position in view;
fill view with other buttons from initial button (count < 20) that they do not intersect ~10 pixels from each other.
What have i done so far:
I created method:
-(void)generateButtonsForView:(UIView *)view buttonCount:(int)count
{
//get size of main view
float viewWidth = view.frame.size.width;
float viewHeight = view.frame.size.height;
//set button at random position
UIButton *initialButton = [[UIButton alloc] initWithFrame:CGRectMake(arc4random() % (int)viewWidth,
arc4random() % (int)viewHeight,
buttonWidth, buttonHeight)];
[initialButton setBackgroundImage:[UIImage imageNamed:#"button"] forState:UIControlStateNormal];
[view addSubview:initialButton];
// set count to 20 - max number of buttons on screen
if (count > 20)
count = 20;
//fill view with buttons from initial button +- 10 pixels
for (int i=0;i<=count;i++)
{
//button
UIButton *otherButtons = [[UIButton alloc] init];
[otherButtons setBackgroundImage:[UIImage imageNamed:#"button"] forState:UIControlStateNormal];
...//have no idea what to do here
}
}
So i'm confused on the place where i want to generate the position of the other buttons, depending on the initial button. I do not know how to generate theirs position that they were at a distance of 5-10 pixels from each other... Any ideas how to realise this? Thanks!
Here's an example with views rather than buttons, but the concept is the same. I use CGRectInset to give the new potential view a buffer of 10 points around it, then look for whether the new view intersects any of the other views. If there's no intersection, add the subview, if there is, try again with a new random location.
-(void)generateButtonsForView {
float viewWidth = self.view.frame.size.width;
float viewHeight = self.view.frame.size.height;
UIView *initialView = [[UIView alloc] initWithFrame:CGRectMake(arc4random() % (int)viewWidth, arc4random() % (int)viewHeight, 50, 30)];
initialView.backgroundColor = [UIColor redColor];
[self.view addSubview:initialView];
int numViews = 0;
while (numViews < 19) {
BOOL goodView = YES;
UIView *candidateView = [[UIView alloc] initWithFrame:CGRectMake(arc4random() % (int)viewWidth, arc4random() % (int)viewHeight, 50, 30)];
candidateView.backgroundColor = [UIColor redColor];
for (UIView *placedView in self.view.subviews) {
if (CGRectIntersectsRect(CGRectInset(candidateView.frame, -10, -10), placedView.frame)) {
goodView = NO;
break;
}
}
if (goodView) {
[self.view addSubview:candidateView];
numViews += 1;
}
}
}

UISegmentControl Programmatically segments frame

I'm using a segment control in the following manner.
CGFloat segmentWidth = 70;
CGFloat segmentHeight = 40;
NSMutableArray *arr = [[NSMutableArray alloc] init];
for (HCIPGRentDetail *object in self.pgHouse.rents) {
[arr addObject:object.roomTypeId];
}
UISegmentedControl *sharingSegmentControl = [[UISegmentedControl alloc] initWithItems:arr];
[sharingSegmentControl setApportionsSegmentWidthsByContent:YES];
sharingSegmentControl.frame = CGRectMake(0, 0, self.pgHouse.rents.count * segmentWidth, segmentHeight);
for (int i = 0; i < sharingSegmentControl.numberOfSegments; i++) {
[sharingSegmentControl setWidth:segmentWidth forSegmentAtIndex:i];
[sharingSegmentControl setTitle:arr[i] forSegmentAtIndex:i];
}
sharingSegmentControl.center = CGPointMake(self.view.center.x, currentHeight + sharingSegmentControl.frame.size.height/2);
currentHeight += sharingSegmentControl.frame.size.height;
[sharingSegmentControl.layer setBorderColor:[UIColor redColor].CGColor];
[sharingSegmentControl.layer setBorderWidth:1.0f];
[sharingSegmentControl setSelectedSegmentIndex:0];
[sharingSegmentControl setBackgroundColor:[UIColor blueColor]];
[sharingSegmentControl setSegmentedControlStyle:UISegmentedControlStyleBar];
[self.mainScrollView addSubview:sharingSegmentControl];
It just displays the segment control with blue colour background and red colour, the segments get a frame (debugger) like {{0,0},{0,29}}. Doesn't understand what I'm missing.
The debugger says this
<__NSArrayM 0x1411be30>(
<UISegment: 0x1411bd60; frame = (0 0; 0 29); opaque = NO; layer = <CALayer: 0x1411bd30>>,
<UISegment: 0x1411a1c0; frame = (0 0; 0 29); opaque = NO; layer = <CALayer: 0x1411b220>>
)
I copied your code and edited it just a bit, so this works for me :
CGFloat segmentWidth = 70;
CGFloat segmentHeight = 40;
UISegmentedControl *sharingSegmentControl = [[UISegmentedControl alloc] initWithItems:#[#"AAA", #"BBB"]];
//[sharingSegmentControl setApportionsSegmentWidthsByContent:YES];
sharingSegmentControl.frame = CGRectMake(0, 0, sharingSegmentControl.numberOfSegments * segmentWidth, segmentHeight);
for (int i = 0; i < sharingSegmentControl.numberOfSegments; i++) {
[sharingSegmentControl setWidth:segmentWidth forSegmentAtIndex:i];
//[sharingSegmentControl setTitle:arr[i] forSegmentAtIndex:i];
}
[sharingSegmentControl.layer setBorderColor:[UIColor redColor].CGColor];
[sharingSegmentControl.layer setBorderWidth:1.0f];
[sharingSegmentControl setSelectedSegmentIndex:0];
[sharingSegmentControl setBackgroundColor:[UIColor blueColor]];
[sharingSegmentControl setSegmentedControlStyle:UISegmentedControlStyleBar];
[self.view addSubview:sharingSegmentControl];
Turns out that tint colour was the problem. Maybe segment control take the tint colour default as clear colour or so.
Somehow, when I just set the tint colour. I got the frame correct, the display correct.

Poor UIScrollView Performance with Many Subviews

I am building a simple app which displays a users Contacts with photos like this -
The contacts are each a positioned subview, with another subview inside containing a UIImageView to generate the images w/rounded corners and a UILabel.
Scrolling becomes rather choppy on both iPhone 4/4s and iPhone 5, however, even with only 6-7 contacts. Also, the choppyness seems to be constant. It doesn't matter if they have 8 contacts or 500 contacts, it doesn't get worse or better either way.
Does anybody know why this might be? The algorithm that generated this grid can be seen below. Are there any specific properties on the UIScrollView I haven't set, etc?
- (void) generateContactGrid
{
CFArrayRef allPeople = ABAddressBookCopyArrayOfAllPeople(self.addressBook);
CFIndex nPeople = ABAddressBookGetPersonCount(self.addressBook);
int peopleInARow = 0;
int maxPeopleInARow = 3;
int positionFromTop = 20;
int IMAGE_SIZE = 70;
float animationOffset = .5;
float animationOffsetChange = .3;
float animationDuration = .5;
int scaleOffset = 40;
int screenWidth = 320;
int startingPositionFromLeft = 26;
int positionFromLeft = startingPositionFromLeft;
int topOffset = 40;
int leftOffset = 26;
int numberOfRows = 0;
UIView *contactContainer;
UIImage* image;
CALayer *l;
NSString *name;
NSString *lastName;
NSString *firstName;
UIImageView *newimageview;
UILabel *label;
UIView *contactImageContainer;
for ( int i = 0; i < nPeople; i++ )
{
ABRecordRef person = CFArrayGetValueAtIndex(allPeople, i);
firstName = (__bridge_transfer NSString*)ABRecordCopyValue(person,kABPersonFirstNameProperty);
lastName = (__bridge_transfer NSString*)ABRecordCopyValue(person, kABPersonLastNameProperty);
name = [NSString stringWithFormat:#"%# %#", firstName, lastName];
if(ABPersonHasImageData(person)){
NSLog(#"Current Contact Being Generated: %#", name);
image = [UIImage imageWithData:(__bridge NSData *)ABPersonCopyImageData(person)];
NSLog(#"Contact's Position From Left: %i", positionFromLeft);
newimageview = [[UIImageView alloc] initWithFrame:CGRectMake(-scaleOffset/2, -scaleOffset/2, IMAGE_SIZE+scaleOffset, IMAGE_SIZE+scaleOffset)];
newimageview.contentMode = UIViewContentModeScaleAspectFit;
[newimageview setImage: image];
contactContainer = [[UIView alloc] initWithFrame:CGRectMake(positionFromLeft, positionFromTop + 20, IMAGE_SIZE, 200)];
contactImageContainer = [[UIView alloc] initWithFrame:CGRectMake(0, 0, IMAGE_SIZE, IMAGE_SIZE)];
contactImageContainer.clipsToBounds = YES;
l = [contactImageContainer layer];
[l setMasksToBounds:YES];
[l setCornerRadius:IMAGE_SIZE/2];
[l setBorderWidth:0.0];
[l setBorderColor:[[UIColor colorWithRed:234.0/255.0 green:234.0/255.0 blue:234.0/255.0 alpha:.6] CGColor]];
[contactImageContainer addSubview:newimageview];
[contactContainer addSubview:contactImageContainer];
label = [[UILabel alloc] initWithFrame: CGRectMake(0, IMAGE_SIZE + 10, IMAGE_SIZE, 20)];
label.text = firstName;
label.backgroundColor = [UIColor colorWithRed:0/255.0 green:0/255.0 blue:0/255.0 alpha:0];
label.textColor = [UIColor whiteColor];
[label setTextAlignment:NSTextAlignmentCenter];
[label setFont:[UIFont fontWithName:#"Arial-BoldMT" size:14]];
[contactContainer addSubview:label];
contactContainer.alpha = 0;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:animationDuration];
[UIView setAnimationDelay:animationOffset];
animationOffset+= animationOffsetChange;
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
contactContainer.alpha = 1;
CGRect temp = contactContainer.frame;
temp.origin.y = positionFromTop;
contactContainer.frame = temp;
[UIView commitAnimations];
if(peopleInARow >= 2){
positionFromTop += IMAGE_SIZE + topOffset;
peopleInARow = 0;
positionFromLeft = startingPositionFromLeft;
numberOfRows++;
} else {
peopleInARow += 1;
positionFromLeft += IMAGE_SIZE + leftOffset;
}
[self.scrollView addSubview:contactContainer];
[self.scrollView bringSubviewToFront:contactContainer];
}
}
NSLog(#"%i", numberOfRows);
self.scrollView.contentSize = CGSizeMake(screenWidth, 150 * numberOfRows);
}
Use Instruments to measure what exactly makes your app slow. Everything else is just guessing.
But I will guess anyways. This most likely is the masking you apply to your UIImageViews. Try disabling that and see if it is still slow (and by see I mean measure, of course). If that is indeed the cause there are two things you can try. First you can set the shouldRasterize property of the masked layer and see if that actually is enough. This could make things worse though if your layers get changed a lot. The other option would be to render those masked pictures with Core Graphics instead of using layers.

Resources