What is the best programmatically approach to display images/icons horizontally? - iphone

I'm trying to place the icons / images horizontally in a view that is intended to show details. Maximum number of pictures per row is 6 pieces and I want to have a mechanism that manage line breaks or similar automatically. I suspect it is a custom cell that solves this?
I have tried the following code below, but the images above to add another when I reload the view. Furthermore, the cell's height is not adjusted by the view that the code returned.
-(UIImageView *)fillView{
collage = nil;
collage = [[[UIImageView alloc] initWithFrame:CGRectMake(11, 7, 0, 0)] autorelease];
int rowCounter = 0;
int colCounter = 0;
int nrOfPictures = [paymentImages count];
//max 6 images per row
while (nrOfPictures > 0) {
while (colCounter <= 6 && nrOfPictures != 0) {
UIImageView *iv = [[UIImageView alloc] initWithImage:[paymentImages objectAtIndex:nrOfPictures-1]];
CGRect frame = iv.frame;
frame.origin.x = (frame.size.width + 4) * colCounter;
frame.origin.y = (frame.size.height + 4) * rowCounter;
iv.frame = frame;
[collage addSubview:iv];
[iv release];
colCounter++;
nrOfPictures--;
if (colCounter > 6) {
colCounter = 0;
rowCounter++;
}
}
}
return collage;
}
Can someone head me in the right direction?

You might want to check out this project. http://github.com/kirbyt/KTPhotoBrowser

Related

How to assign values to images [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
Alright, so I have 5 custom images total.
Heres the values I need to set each image to:
Image1 = 1
Image2 = 2
Image3 = 3
Image4 = 4
Image5 = 5
I need values assigned to these because I want to have xcode randomly place them on the view until it reaches a value of 50. So im assuming I need some kind of loop that adds up the values until 50 is reached?
How do I assign values to these images since it brings up a warning when trying to assign an int value to a UIImage. Also, on a side note what method would I use to randomly place the images on the view without overlapping?
Thanks for any and all help!
Your app will be placing UIImageViews, not UIImages onto a view. Like all UIView subclasses, UIImageView has an NSInteger tag property, but if I understand the problem correctly, I don't think you need that, either.
// add count randomly selected images to random positions on self.view
// (assumes self is a kind of UIViewController)
- (void)placeRandomImages:(NSInteger)count {
for (NSInteger i=0; i<count; ++i) {
UIImage *image = [self randomImage];
UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
imageView.frame = [self randomFrameForImage:image];
[self.view addSubview:imageView];
// add a tag here, if you want, but I'm not sure what for
// imageView.tag = i;
}
}
// answer a random image from the app's bundle
// assumes the images are named image-x where x = 0..4
- (UIImage *)randomImage {
NSInteger imageNumber = arc4random() % 5;
NSString *imageName = [NSString stringWithFormat:#"image-%d", imageNumber];
return [UIImage imageNamed:imageName];
}
// answer a random position for the passed image, keeping it inside the view bounds
- (CGRect)randomFrameForImage:(UIImage *)image {
CGFloat imageWidth = image.width;
CGFloat imageHeight = image.height;
CGFloat maxX = CGRectGetMaxX(self.view.bounds) - imageWidth;
CGFloat maxY = CGRectGetMaxY(self.view.bounds) - imageHeight;
// random location, but always inside my view bounds
CGFloat x = arc4random() % (NSInteger)maxX;
CGFloat y = arc4random() % (NSInteger)maxY;
return CGRectMake(x,y,imageWidth,imageHeight);
}
If want to assign an arbitrary integer value, I would use the tag property on UIImageView.
NSInteger currentTag = 50;
while (currentTag > 0) {
UIImageView *imageView = [UIImageView alloc initWithImage:image];
imageView.tag = currentTag;
[self.view addSubView:imageView];
currentTag--;
}
Put the images into an NSArray then from NSHipster:
How Do I Pick a Random Element from an NSArray
Use arc4random_uniform(3) to generate a random number in the range of a non-empty array.
if ([array count] > 0) {
id obj = array[arc4random_uniform([array count])];
}

UITabBar changing each time to a new tab, without scrolling to middle

I want to create an tabBar with 15 items that can be scroll right-left and stop in the middle and not just scrolling each time all the 5 items (320 every time)
I found a code and changed it for displaying 5 items, but when i'm scroll it, all the tab changed and the next tab with 5 items shown, and so on...
- (id)initWithItems:(NSArray *)items {
self = [super initWithFrame:CGRectMake(0.0, 411.0, 320.0, 49.0)];
if (self) {
self.pagingEnabled = YES;
self.delegate = self;
self.tabBars = [[[NSMutableArray alloc] init] autorelease];
float x = 0.0;
for (double d = 0; d < ceil(items.count / 5.0); d ++) {
UITabBar *tabBar = [[UITabBar alloc] initWithFrame:CGRectMake(x, 0.0, 320.0, 49.0)];
tabBar.delegate = self;
int len = 0;
for (int i = d * 5; i < d * 5 + 5; i ++)
if (i < items.count)
len ++;
tabBar.items = [items objectsAtIndexes:[NSIndexSet indexSetWithIndexesInRange:NSMakeRange(d * 5, len)]];
[self addSubview:tabBar];
[self.tabBars addObject:tabBar];
[tabBar release];
x += 320.0;
}
self.contentSize = CGSizeMake(x, 49.0);
}
return self;
}
How can i create a 'rubber effect' so i can be stop on the 7 item for example.
You will have to use a different design than the one you quote. If you look at the code carefully you will notice that for each 5 items a new tab bar is created. Clearly, the functionality that you hope for is not feasible with this setup.
The alternative would be to rewrite this with your own UIScrollView. It could be challenging to get exactly the look and feel of the UITabBar, but perhaps that is not such an important constraint. Rather, you would be free to implement your very own design that harmonizes with the look of your app.

iOS: Rows of images in ScrollView

I'm just getting started with iOS development. I would like to create a view that would contain 2 rows of image thumbnails as a preview. It would scroll horizontally. I'm wondering if the best approach would be to use 2 scrollviews or place them in a tableview with 2 rows.
If your thumbnail images and rows are essentially static, your best bet might be to drop your thumbnail image views directly into your scrollView. You can layout your thumbnail subviews into two rows and as many columns as necessary with some arbitrary calculations and avoid the need to use a UITableView (which works very well for scrolling rows, but doesn't natively support columns, and as a tool isn't imo the best for this particular job).
If you do elect to use a UITableView, I would put it into a single UIScrollview.... Unless you specifically seek two discretely scrolling rows, I wouldn't implement this with two UIScrollViews.
Here is a code snippet that suggests an approach. Consider 1)All subviews should be the same size 2)The subviews will "grid" themselves according to the bounds of the containing view. I wrote this snippet for a regular UIView (not a UIScrollView), but the concept will be the same: Consider size of scrollContent. Consider how many subviews will fit horizontally, and how many will fit vertically (hence, if you want 2 rows, the scroll view height should be just high enough to fully encompass the height of a single subview * 2):
- (void)layoutSubviews
{
//Lays out subviews in a grid to fill view.
float myWidth = self.bounds.size.width;
float myHeight = self.bounds.size.height;
if ([[self subviews] count] < 1)
{
return; //no subviews, must be added before layoutSubviews is called.
}
CGRect aSubviewRect = [[[self subviews] objectAtIndex:0] frame];
int numberOfColumns = (int)(myWidth / aSubviewRect.size.width);
float actualColumnWidth = myWidth / (float)numberOfColumns;
CGFloat paddingPerColumn = (actualColumnWidth - aSubviewRect.size.width);
int maxRows = (int)(myHeight / aSubviewRect.size.height);
int qtyOfViews = [[self subviews] count];
int numberOfRows = (qtyOfViews / numberOfColumns);
if ((qtyOfViews % numberOfColumns) > 0) //we need remainder row
{
++numberOfRows;
}
if (numberOfRows > maxRows)
{
numberOfRows = maxRows;
NSLog(#"More rows required than fit.");
}
float actualRowHeight = myHeight / (float)numberOfRows;
CGFloat paddingPerRow = (actualRowHeight - aSubviewRect.size.height);
for (UIView *aSubview in [self subviews])
{
int viewIndex = [[self subviews] indexOfObject:aSubview];
int rowIndex = (viewIndex / numberOfColumns);
CGFloat yOrigin = (roundf(((float)rowIndex * aSubviewRect.size.height) + (((rowIndex + 1) * paddingPerRow) / 2)));
int columnIndex = (viewIndex % numberOfColumns);
CGFloat xOrigin = (roundf(((float)columnIndex * aSubviewRect.size.width) + (((columnIndex + 1) * paddingPerColumn) / 2)));
CGRect frame = [aSubview frame];
frame.origin.y = yOrigin;
frame.origin.x = xOrigin;
[aSubview setFrame:frame];
}
}

Please help! Creating new objects (from array?) after an object completes task

I am writing an iPhone application and here is the overall synopsis:
An object is on the screen and moves based on accelerometer input - I have that working - it moves to the edge of the screen and doesn't go off = perfect. Now, what I want to happen is as soon as that object hits any of the four screen edges, it should stop and stay put on the screen, and a new object should 'appear' and start moving due to the accelerometer input, so now two objects would be on the screen, but only 1 moving. Eventually there could be 20 objects built up around the edge, but only 1 object will be moving at a time.
So I have now gotten the help I needed to check for edge hits etc, but I am now trying to switch the way I was getting boxes to show up on the screen. I originally was putting images on the screen through the view controller, but now what I want to do is start with one box in the center, when it hits an edge, it should stop and stay, and a new image will appear in the center and start moving due to accel input as described above. So do I just use an array to pull the images from? Do I not even put .png's on the view controller and should I just code it? Here is some of what I have trying to do this through an array:
//In my .h
UIImageView *blocks;
NSString *blockTypes[3];
//In my .m
blockTypes[0] = #"greenBox1.png";
blockTypes[1] = #"greenBox2.png";
blockTypes[2] = #"greenBox3.png";
Thanks in advance for any help! The help so far has been great!
You should't test if newX and newY are equal to 30 and 50. You should test if they are less than 30 and 50 respectively.
Edit:
I would do it like this:
loat newX = [mutableBoxArray lastObject].center.x + (accel.x * 12);
float newY = [mutableBoxArray lastObject].center.y + (accel.y * -12);
if(newX > 30 && newY > 50 && newX < 290 && newY < 430) {
[[mutableBoxArray lastObject] setCenter: CGPointMake(newX, newY)];
} else {
MyBox *myBox = [[MyBox alloc] init];
[mutableBoxArray addObject: myBox];
[myBox release];
}
Edit 2:
Add the following in your interface file
NSMutableArray *mutableBoxArray;
NSArray *imageNamesArray;
Then in your implementation file in the loadView add
mutableBoxArray = [[NSMutableArray alloc] init];
imageNamesArray = [[NSArray alloc] initWithObjects: #"orangeBox1.png",
#"blueBox1.png", #"greenBox1.png", #"pinkBox1.png", nil];
Then change the above method to
static NSInteger imageInt = 0;
loat newX = [mutableBoxArray lastObject].center.x + (accel.x * 12);
float newY = [mutableBoxArray lastObject].center.y + (accel.y * -12);
if(newX > 30 && newY > 50 && newX < 290 && newY < 430) {
[[mutableBoxArray lastObject] setCenter: CGPointMake(newX, newY)];
} else {
if (imageInt < [imageNamesArray count]) {
UIImage *image = [UIImage imageNamed: [imageNamesArray objectAtIndex: imageInt++]];
UIImageView *imageView = [[UIImageView alloc] initWithImage: image];
[imageView setCenter: CGPointMake(100.0f, 100.0f)];
[mutableBoxArray addObject: imageView];
[imageView release];
}
}

how to load the images in my view dynamically in a scroll view in iPhone

i want to display many images like thumbnails in a scroll view and and i want the images displayed dynamically we scrolls down or left like a table view cells
can u please tell how to that...
Thanks
with the following code..when we scroll the scroll view im calling this code and able to display the images dynamically (which r only visible) but the problem is.. while scrolling with scroll bars im getting the two images..vertically and horizontally..its only happening when i scroll.. can any body help me out please..?
int tileSize;
int imgSize;
if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad){
tileSize = 255;
imgSize = 247;
}else{
tileSize = 120;
imgSize = 116;
}
CGRect visibleBounds = [songsContainer bounds];
for (UIView *tile in [songsContainer subviews]) {
CGRect scaledTileFrame =[tile frame];
if (! CGRectIntersectsRect(scaledTileFrame, visibleBounds)) {
for(UIView *view in [tile subviews])
[view removeFromSuperview];
[recycledCells addObject:tile];
[tile removeFromSuperview];
}
}
int maxRow =[songsDict count]-1; // this is the maximum possible row
int maxCol = noOfRowsInCell-1; // and the maximum possible column
int firstNeededRow = MAX(0, floorf(visibleBounds.origin.y / tileSize));
int firstNeededCol = MAX(0, floorf(visibleBounds.origin.x / tileSize));
int lastNeededRow = MIN(maxRow, floorf(CGRectGetMaxY(visibleBounds) / tileSize));
int lastNeededCol = MIN(maxCol, floorf(CGRectGetMaxX(visibleBounds) / tileSize));
NSLog(#".........MaxRow-%d,MaxCol-%d,firstNeddedRow-%d,firstNeededcol-%d,lNR-%d,lNC%d",maxRow, maxCol, firstNeededRow,firstNeededCol,lastNeededRow,lastNeededCol);
// iterate through needed rows and columns, adding any tiles that are missing
for (int row = firstNeededRow; row <= lastNeededRow; row++) {
NSMutableArray *tempArray = (NSMutableArray *)[songsDict objectAtIndex:row];
for (int col = firstNeededCol; col <= lastNeededCol ; col++) {
BOOL tileIsMissing = (firstVisibleRow > row || firstVisibleColumn > col ||
lastVisibleRow < row || lastVisibleColumn < col);
if (tileIsMissing) {
UIView *tile = (UIView *)[self dequeueReusableTile];
if (!tile) {
// the scroll view will handle setting the tile's frame, so we don't have to worry about it
tile = [[[UIView alloc] initWithFrame:CGRectZero] autorelease];
tile.backgroundColor = [UIColor clearColor];
}
//tile.image = image for row and col;
// set the tile's frame so we insert it at the correct position
CGRect frame = CGRectMake(tileSize * col, tileSize * row, imgSize, imgSize);
tile.frame = frame;
if(col<[tempArray count])
[self addContentForTile:tile:row:col];
else tile.backgroundColor = [UIColor clearColor];
[songsContainer addSubview:tile];
}
}
}
firstVisibleRow = firstNeededRow+1; firstVisibleColumn = firstNeededCol+1;
lastVisibleRow = lastNeededRow; lastVisibleColumn = lastNeededCol;
What you have to do is create your scrollview however you want. You have to decide whether you want a grid layout, or linear layout. In addition, if grid, do you want it locked to the horizontal bounds, locked to vertical, so it scrolls either vertical or horizontal, respectively.
Once you have that sorted out, then what I recommend is taking the architecture similar to how a tableview functions. That is, create individual "cells" that will hold your thumbnails. Once you have these cells, you add them as subviews of your scrollview, at certain offsets (you need to do some math on the x/y planes).
Start with a scroll view and add each image in an UIImageView as a subview to the scrollview at a certain location.
One thing to have in mind is to only hold in memory the images that are currently shown and their immediate neighbours.