Adding Images By incrementing label count - ios

Here,when button taps label count is increments & decrements.While label count increments images will be added by respective count.here my code for incrementing label count
if (counter >= 9 )
return;
[_count setText:[NSString stringWithFormat:#"%d",++counter]];
but i need to display while incrementing the label count then automatically increments images one by one.like this
Can you please help me how can i implement,thank you.

Add a UIScrollView in place of where you want to show images. When click on '+' button, call following method by passing the 'counter' value.
-(void)addImage:(int) count {
UIScrollView * scView = [[UIScrollView alloc] init];
scView.frame = CGRectMake(30, 60, self.view.frame.size.width, 60);
UIButton * btn;
UIImageView * imgV;
float imgWidth = 44;
for(int i=0;i<count;i++) {
imgV = [[UIImageView alloc] init];
imgV.frame = CGRectMake(i*imgWidth, 0, imgWidth, 44);
imgV.image = [UIImage imageNamed:#"gitar"];
[scView addSubview:imgV];
}
[scView setContentSize:CGSizeMake(imgWidth*count, 50)];
[scView setBackgroundColor:[UIColor redColor]];
[self.view addSubview:scView];
}
- (IBAction)descrese:(id)sender {
counter -= 1;
[self addImage:counter];
}
- (IBAction)btnTap:(id)sender {
counter += 1;
[self addImage:counter];
}
This adds as many images as you want in horizontal scroll view.

use a uiscrollview with cells of images, that simple.

Use UIScrollView.
As number of elements is increasing/decreasing:
1) increse/deacrease UIScrollView size respectively
2) add/remove elements

I guess, the screenshot was taken from MMT app. They're using this feature in their app. I believe, they might have developed a separate control to handle this thing, where they can only pass few arguments like image to show (people), count etc.
You can also develop such kind of UI with following way:
Create a custom view, take a UICollectionView inside it, take argument of image to show and number of rows count, fixed the cell size in layouts. Add a method which will reloads UI (inside logic: reloading UICollectionView) to refresh content when user taps on [ + ] or [ - ] button. Why, we're not taking UIScrollView, with it we can't reuse contents. I believe this step will need you to create everything programmatically.
When user taps on [ + ], you should increase width of our custom view, inside
you should override layoutSubview method to update frame of UICollectionView as well. You may require to refresh(reload) cells inside UICollectionView.
Do reverse when user taps [ - ].
You may require to set some logic so user can't add more/less numbers when selection.
This is just an idea, you may require to check each cases which the reference app has having.

Related

UIScrollView Lazy Loading Images

My app for the iPhone Contains 170 images. I read them into an array, and in the loop add a picture in the viewfinder, then put the image View as sub view of scroll view.
When running my app uses too much memory 700mb. I tried to reduce the size of the pictures, but it didn't work.
One of my friends said that I should add only images # 1 and # 2. When the user block is scrolled to the picture No. 1, then only show the picture No. 2. Then the picture No. 1 to remove from the image viewer and add the picture No. 3.
He says that in this way I can maintain the normal memory consumption. But I don't understand how to do this?
Could you help with an example? Thanks in advance.
Not using UICollectionView
Here is my code:
- (void)addImageViewToScrollView {
_assetsArray = [[NSMutableArray alloc] init];
for (int j = 0; j < 170; j++) {
[_assetsArray addObject:[UIImage imageNamed:[NSString stringWithFormat:#"%d",j]]];
}
//scrollView add subview ImageView
for (int i = 0; i < [_assetsArray count]; i++) {
CGRect frame;
frame.origin.x = self.scrollView.frame.size.width *i;
frame.origin.y = 0;
frame.size = self.scrollView.frame.size;
_imageView = [[UIImageView alloc]init];
_imageView.image = [_assetsArray objectAtIndex:i];
_imageView.frame = frame;
[self.scrollView addSubview:_imageView];
}
self.scrollView.contentSize = CGSizeMake(self.scrollView.frame.size.width * self.assetsArray.count, self.scrollView.frame.size.height);
}
--
Use a UICollectionViewController to solve this issue.
This way only the cells that are required on screen are loaded and all others images are can be popped from cache when you hit a memory warning.
Collection Views work very similar to table views.
To get the collection view to suit what you're doing you'll need to set the flow layout to horizontal scrolling and set the cell sizes to your view's height and width.
Seems like you are trying to add170images onto UIScrollView using UIImageView. Why not use dedicated UITableView's or UICollectionView's? Object of Reusable Cell is to maintain run-time memory consumption. Let's recap on this,
You have 170 ImageViews (_assetsArray) ; expensive consumption
You have 170 Images
Versus, Using UITableView or UICollectionView
You have 1 ImageView in a Cell with 170 rows
You have DataSource of 170 Images were loaded
Your cell will be re-cycled when it needed to display correspond to DataSource
Also, for supporting the multitude images, there are good libraries to reduce images cache. Try to use SDWebImage or FastImageCache. I personally like FIC but you might need to understand the concept.

How to use UIPageControl to navigate through images?

-- XCODE 5, iOS 7 --
I want to create an instruction manual for my application with 7 pictures sized 280 x 342, with a UIPageControl with 7 dots below it. I want to have it so the user swipes to the right and it navigates through the images i've made, showing the user how to play my game.
I've been searching for hours and can't find anything, I even tried asking on here already but wasn't given much help.
If anyone could direct me to a tutorial that explains how to do this, or write out the code and show me it would be much appreciated.
Thanks.
Ballpark:
-(void)setupPagingScrollView
{
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0,0,280,342)];
[self addSubview:scrollView];
[scrollView setDelegate:self]
[scrollView setPagingEnabled:YES];
control = [[UIPageControl alloc] initWithFrame:yourPagingButtonsFrame];
[control setNumberOfPages:[imagePanes count]];
[self addSubview:control];
}
-(void)scrollViewDidScroll:(UIScrollView *)inScrollView
{
UIPageControl *control;
int currentPage = inScrollView.contentOffset.x / inScrollView.bounds.size.width;
[control setCurrentPage:currentPage];
}
You need to create a scrollview with paging enabled (this is what you will add your images to). Then you need to create a UIPageControl. Then when the scrollview scrolls (or when the scrollview ends scrolling, your choice there) you change the UIControl's page number based on the scroll position.
You can also set the UIPageControl's delegate to yourself so that you can listen for tab button clicks from it and adjust your scrollview accordingly, but I use it as a display of information only, not to receive user input.
Put the images side by side in a scrollview. Put a UIPageControl on top and set the number of pages to 7. Then use
-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
CGFloat pageWidth = scrollView.bounds.size.width;
NSInteger pageNumber = floor((scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
self.pageControl.currentPage = pageNumber;
}

Identify UIImageView and UITextView created in loop iOS

I'm working in Xcode and i have a loop cycle in which i dynamically create UIImageViews and UITextviews and insert them in a UIScrollView. In every row, i create 4 UIImageViews and 2 UITextViews, so the code looks like this:
for (int i=0; i<dim; i++){
UITextView *textView1= [[UITextView alloc] initWithFrame:CGRectMake(0, 0, screenWidth/2, 37)];
UITextView *textView2= [[UITextView alloc] initWithFrame:CGRectMake(screenWidth/2, 0, screenWidth/2, 37)];
UIImageView *imageView1 = [[UIImageView alloc] initWithFrame:CGRectMake(0,50,screenWidth/4,100)];
UIImageView *imageView2 = [[UIImageView alloc] initWithFrame:CGRectMake(screenWidth/4,50,screenWidth/4,100)];
UIImageView *imageView3 = [[UIImageView alloc] initWithFrame:CGRectMake(screenWidth/2,50,screenWidth/4,100)];
UIImageView *imageView4 = [[UIImageView alloc] initWithFrame:CGRectMake(screenWidth*3/4,50,screenWidth/4,100)];
}
The code to set images in UIImageViews, text in UITextViews and show them in the UIScrollView works great and i don't post it because it's too long.
My problem is: when i click on an image, i call methods in which i want to make change to the ImageViews and TextViews of the same row, how can i identify them?
Detecting the image clicked is not a problem using the recognizer.view, to detect other images of the same row i tried to set a tag to the views and then call "viewWithTag" to find them, but i have problems because the elements of the same row have the same tag value and i make confusion.
My target is for example:
When i click on imageView1 in the first row should change image in imageView3 of the same row.
When i click on imageView3 in the fourth row should change text in textView2 of the same row.
And so on..
Is there any alternative method without using the tag attribute?
I hope I explained myself
You can use the tag property, but without using the same tag more then once. Some little math should do the trick to identify views in the same row by their tags...
BUT:
I wouldn't recommend using tags. Make yourself a custom view class, e.g. MyRow, containing the 6 views belonging together as subviews. From there you can go anywhere.
Got a problem, invent an object. Always works.
BIGGER BUT: I'd strongly recommend to go with UICollectionView or UITableView.
UIView has a "tag" property, which you can use for anything you want. The default value is 0 and it doesn't do anything at all, except store the value.
Typically you would set the tag to be an array index.
So you could do:
textView1.tag = i;
textView2.tag = i;
imageView1.tag = i;
imageView2.tag = i;
imageView3.tag = i;
imageView4.tag = i;
Or perhaps something more clever, like:
textView1.tag = 1000000 + i;
textView2.tag = 2000000 + i;
imageView1.tag = 3000000 + i;
imageView2.tag = 4000000 + i;
imageView3.tag = 5000000 + i;
imageView4.tag = 6000000 + i;
Or maybe you could have an array property mapping them:
#property NSMutableArray tagMap;
textView1.tag = self.tagMap.count;
[self.tagMap addObject:#{#"var": #"textView1", #"index":[NSNumber numberWithInteger:i]}];

Scroll a view with 20 text boxes horizontally using UIScrollView

I have to implement 20 text boxes horizontally. How can I add a scroll bar to see all text boxes when I scroll to the left.
please try following code:
UIScrollView *scrlView=[[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 320, 50)];
scrlView.scrollEnabled=YES;
int x=5;
int y=5;
for (int i=0;i<20;i++ ) {
UITextField *txtField=[[UITextField alloc] initWithFrame:CGRectMake(x,y , 100,40 )];
txtField.tag=i;
txtField.delegate=self;
[scrlView addSubview:txtField];
x+=105;
}
scrlView.contentSize=CGSizeMake(x, 50);
[self.view addSubview:scrlView];
i hope this code will help you.
You can find plenty of questions about this topic (i.e., Calculate the contentsize of scrollview), but nonetheless here is my solution:
You want to use the UIScrollView for the task. Using it is rather simple in fact.
First you need to initialise and display the UIScrollView somewhere in your screen. I am going to assume that you are in a UIViewController, and that you want to create a scroll view of 300px width and 200px height. For this, you can do the following:
UIScrollView *aScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, 300, 200)];
[[self view] addSubview:aScrollView];
[aScrollView setScrollEnabled:YES];
Now its time to place the content inside of it.
The key idea here to take into consideration is the following. While the 'UIScrollView' has a size itself, it also has an internal size for it's content, which is essentially the are that is scrollable.
Let's suppose that you have 20 items, each of which has a size of '40px width', and '200px height'. I am also going to suppose that you will want to leave a space of 10px between each text box. Thus, the total scrollable width for the area that we want to have inside the 'UIScrollView' is the following: (20 (items) * (40 (size of each item) + 10 (distance between each item))) -10. We shall then do the following:
[aScrollView setContentSize:CGSizeMake((20*(40 + 10))-10), 200];
All right, we are almost done. Now all we have to do is add each of the text items to the scroll view. Instead of doing it one by one, I am going to assume that you have them inside a collection such as a NSArray (probably an NSMutableArray).
NSArray *textFields; // the array with the collection of text boxes
int x = 0;
for (UITextField *aTextField in textFields){
[aTextField setFrame:CGRectMake(x, 0, 40, 200)];
[[self view] addSubview:aTextField];
x += 40 + 10; // incrementing the X coordinate to correctly place the next item
}
That's it!

multiple UIPickerViews - without a .xib

I have a view. I would like to be able to put 1-3 UIPickerViews in it. The number of UIPickerViews is determined by the value of a variable myVariable. Each UIPickerView is different. Some of the values for myVariable mean that there will only be one UIPickerView in the view, but some mean that I will have to put 2 or 3 in the view, and it will be laid out vertically (so one UIPickerView is directly above the other). Right now, every case where myVariable means that it needs only 1 UIPickerView, I'm putting them in the view like this:
if (myVariable == kNeedsOnlyOnePicker)
{
myPicker = [[UIPickerView alloc] initWithFrame:self.view.frame];
[myPicker setDelegate:self];
[myPicker setDataSource:self];
myPicker.showsSelectionIndicator = YES;
[self.view addSubview:myPicker];
}
However, I'm just not sure how to tell the code something like this:
if (myVariable == kNeedsTwoPickers)
{
// put myPicker and myOtherPicker in self.view,
// and put myPicker above myOtherPicker.
}
I have a hunch I won't be able to use the .xib to do something like this, because I won't be able to set up different layouts (e.g. picker 1 above picker 2, picker 2 above picker 3, only picker 3).
TL;DR how do I programmatically say, "this subview will go above this other subview" or "this picker will go above this other picker"?
Specific methods/examples and/or general ideas would be great.
Thanks!
I found that I could set the frame for the subview and calculate its coordinates.
- (void)layout
{
for (int i= 0; i < [self.view.subviews count]; i++)
{
// calculate x, y, width, and height
UIView *subview = [self.view.subviews objectAtIndex:i];
subview.frame = CGRectMake(x, y, width, height);
}
}

Resources