creating thumbnail of an image programmatically - iphone

in my application i am getting images from the server and i am able to display the images in image view....
but now i want to store the images getting from the server in a table view and display them while clicking in the table view cell . what i want is how to make the thumbnail of the image in order to display it in table view cell .if i display the image directly in table view cell it is some what appearing clumsy.... for that i want to make the thumbnail of that image and to display it in table view cell...
can any one please help me how to create thumbnail of a image programatically......

Find the blog tutorial for creating thumbnail of an image programmatically
http://johnnytrops.com/blog/wp/2009/02/03/iphone-creating-an-image-thumbnail/
Here is one more
http://www.nickkuh.com/iphone/how-to-create-square-thumbnails-using-iphone-sdk-cg-quartz-2d/2010/03/

- (void) createThumbView { float y_axis = Set y axis;
int x = 0;
int totalImgs = total images;
int tempCnt = 0;
for (int i = 0; i < totalImgs;)
{
float x_axis = set x axis;
int loopCount = 0;
if (totalImgs - tempCnt >= (no of images in row))
{
loopCount = (no of images in row);
}
else
{
loopCount = totalImgs % (no of images in row);
}
for (int j = 0; j < loopCount; j++)
{
MasksData *mData = [masksList objectAtIndex:x];
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(x_axis, y_axis, width, height);
[btn setImage:[UIImage imageNamed:[NSString stringWithFormat:#"%#.png",mData.bgImage]] forState:UIControlStateNormal];
btn.backgroundColor = [UIColor clearColor];
btn.tag = x;
[scroll View addSubview:btn];
//photoCount++;
x_axis += width + some space;
tempCnt++;
i++;
x++;
}
y_axis += height + some space;
scroll View.contentSize = CGSizeMake(320.0, y_axis);
}

Related

Proper Way for Create Dynamic UIButton in ScrollView?

I am new to iOS Development.
I have a navigation based Application, In my application I created dynamic buttons by using a for loop.
I have two UITextFields (row and column) in FirstViewController. When user enters a value of row and column then click on OK Button the values of row and column passes to anOtherViewController. In anOtherViewController I have to put a logic to create All Buttons based on row and column value.
MyLogical Code:
for (int i = 1 ; i <= rows; i++)
{
for (int j = 1 ; j <= columns ; j++)
{
NSString *btnTitle = [NSString stringWithFormat:#"%d",buttonCount];
self.btnCount = [UIButton buttonWithType:UIButtonTypeRoundedRect];
self.btnCount.tag = [btnTitle intValue];
[self.btnCount setTitle: btnTitle forState: UIControlStateNormal];
[self.btnCount addTarget:self action:#selector(btnCountPressed:) forControlEvents:UIControlEventTouchUpInside];
self.btnCount.frame = CGRectMake(162+changedX, 60+changedY, 43, 43);
[self.scrollView addSubview:self.btnCount];
[self.listOfbtnCount addObject:btnTitle];
changedY = changedY + 50;
buttonCount = buttonCount + 1;
}
changedX = changedX + 55;
if (i == rows)
widthScView = changedX;
if (heightScView == 0)
heightScView = changedY;
changedY = 5;
}
My ScreenShot:
It works fine, but my problem is that if I enter values of row and column more then 40 (about) then my app takes more time to create the dynamic button. The issue is only related to the time required to create the button.
Is there any way to create a button faster? and I also need to know is if my code is bad for memory management? please help me on this issues.
For Information : I Have no errors generated, I have issue of only time consuming process of creation of Buttons.
Thank in Advance.
You should use UICollectionView for this.
UICollectionView works a lot like UITableView in that it'll manage the cells that are displayed on screen, including scrolling, and it'll ask its data source for new cells as it needs them. You can also recycle cells, so you'll only need to create about enough to display, plus a few extra. This should really improve performance, especially when scrolling.
Apple has some sample code using UICollectionView here, and watching Introducing Collection Views in the 2012 WWDC Videos will get you off to a good start.
my problem is that If i enter values of row and column more then 40
Forty rows of forty columns would give you 1600 buttons, most of which don't need to exist most of the time. By managing which cells are needed on screen for you, UICollectionView will reduce that to around eighty (judging by your screen shot). You should see much, much better performance this way.
UICollectionView will also simplify positioning the buttons once you've configured the collection view (which you can do in code or in Interface Builder), you won't need any code of your own for calculating the positions of the buttons.
just implement you logic here with your requirement..
int imageIndex = 0;
int yOffset = 4;//set offset which you want...
while (imageIndex < rows)
{
int yPos = 7 + yOffset * 30; // set distance in height between two raws
for(int i = 0; i < columns; ++i)
{
CGRect rect = CGRectMake((0 + i * 80), yPos, 80, 31);**// here set frame of every button with different x and y postion// here width of button is 80 and height is 31**
if (imageIndex < rows) {
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
button.frame = rect;
button.tag = imageIndex;
[button addTarget:self
action:#selector(btnTemp_Clicked:)
forControlEvents:UIControlEventTouchDown];
[button setTitle:[NSString stringWithFormat:#"%d",imageIndex] forState:UIControlStateNormal];
[button.titleLabel setFont:[UIFont fontWithName:#"Helvetica-Bold" size:12]];
// [button.titleLabel setTextColor:[UIColor blueColor]];
[button setTitleColor:[UIColor colorWithPatternImage:[UIImage imageNamed:#"circle03.jpg"]] forState:UIControlStateNormal ];
[button setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted ];
[button setNeedsDisplay];
[yourScrollView addSubview:button];
}
++imageIndex;
}
++yOffset;
}
See the screen which i got output..
Try this method
-(void)ScrollViewSetting {
scrollview.scrollEnabled=YES;
scrollview.userInteractionEnabled=YES;
TotalStyleX=25;
TotalStyleY=18;
int count=0;
int px=0;
int py=0;
for (int i=1; i<=TotalStyleX; i++) {
px=0;
for (int j=1; j<=TotalStyleY; j++) {
count++;
UIButton *btn1=[[UIButton alloc] init];
btn1.tag = count;
btn1.frame=CGRectMake(px+10, py+10, 300, 380); //you can set your height and width your x and y position
[scrollview addSubview:btn1];
px=px+320;
}
py=py+400;
}
[scrollview setContentSize:CGSizeMake(px, py)];
}

UIScrollView + UIPageControl + UIButton

How do you make a menu like in Cut the Rope game. Image below:
I am able to make three images slide horizontally but failed to make it as a button.
Though I don't need it to be fancy as the game's, but just a simple button.
Do I need to stack three different Views with its respective buttons inside UIScrollView? I am leaning towards doing it programmatically though.
Code: http://pastebin.com/ikrJ1U7w
Its actually a UIScrollView which containing UIButton of custom type & has image on that. Below that is UIPageIndicator.
You can create it as below, althouh also search for
How to create UIButton programatically to add on scrollview
In your view controller,
In viewDidLoad, in scrollView add the buttons.
UIScrollView *scrollView = // initalize & set frame as per ur req
scrollView.userInteractionEnabled = YES;
scrollView.pagingEnabled = YES;
float x = 0.0;
float y = 0.0, width = 320.0;
float height;
for (int j = 0; j <= numberofpagesYouwant; j++)
{
CGRect frame;
UIButton *button = // Create a button at here;
frame = CGRectMake(x, y, width, height); // Use this as your button frame
[scrollView addSubview:button];
[button release];
x = x + width;
}
scrollView.contentSize = CGSizeMake(numberOfPagesYouHave * 320, heightOfYourScrollView);
}
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
CGFloat pageWidth = self.scrollView.frame.size.width;
int page = floor((self.scrollView.contentOffset.x - pageWidth / 2) / pageWidth) + 1;
if(page != activityIndicator.currentPage)
{
NSLog(#"now page change:%d",page);
[self changePageIndicator:page];
}
}
-(void)changePageIndicator:(int)index
{
activityIndicator.currentPage = index;
}
- (void)setNumberOfPages:(int)numPages1
{
activityIndicator.numberOfPages = numPages1;
}
Yes, I am pretty sure this is just several buttons placed on top of some sort of a scrollView. (most likely done programatically).

Programmatically create UIButtons on CircleImage

I need to create Arch shaped UIButtons, on a circle image.(the O/p need to look like Concentric Circles),
At present I am using 5 images, but in future I may add some more Images, Dynamically I need to fil the circle Image with the added images.
I had a sample Piece of code and O/P is the below image
int numberOfSections = 6;
CGFloat angleSize = 2*M_PI/numberOfSections;
for (int j = 0; j < numberOfSections; ++j) {
UIButton *sectionLabel = [[UIButton alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 150.0f, 2.0f)];
sectionLabel.backgroundColor = [UIColor redColor];
sectionLabel.layer.anchorPoint = CGPointMake(1.0f, 0.5f);
sectionLabel.layer.position = CGPointMake(container.bounds.size.width/2.0, container.bounds.size.height/2.0); // places anchorPoint of each label directly in the center of the circle.
sectionLabel.transform = CGAffineTransformMakeRotation(angleSize*j);
[container addSubview:sectionLabel];
}
I have tried with this piece of code and the O/P is the below image
int numberOfSections = 5;
CGFloat angleSize = 2*M_PI/numberOfSections;
for (int j = 0; j<numberOfSections; ++j) {
UIImage *imageframe = [imagesArray objectAtIndex:j];
OBShapedButton *button = [[OBShapedButton alloc] initWithFrame:CGRectMake(0.0f, 150.0f, 150.0f, 128.0f)];
button.transform = CGAffineTransformMakeRotation(angleSize*j);
[container addSubview:button];
}
I need my output as the below image
How can i Achieve that
O/P after I Tried with Sarah Zuo's code
same width and height buttons
AnyKind of Help is more Appreciated
I can answer only last part,
If you are able to get images for buttons, then you can refer this tutorial. This might help you. Provided, your image formed is having transparent background.
float radius = container.bounds.size.width / 2;
int numberOfSections = 5;
CGFloat angleSize = 2*M_PI/numberOfSections;
for (int j = 0; j<numberOfSections; ++j) {
UIImage *imageframe = [imagesArray objectAtIndex:j];
OBShapedButton *button = [[OBShapedButton alloc] initWithFrame:CGRectMake(0.0f, 150.0f, 150.0f, 128.0f)];
button.transform = CGAffineTransformMakeRotation(2*M_PI-angleSize*j);
button.center = CGPointMake(radius + radius * sin(angleSize * j) / 2, radius + radius * cos(angleSize * j) / 2);
[container addSubview:button];
}
Try this code.
You can use your UIImageView instead. You can give different tag to image view and add Gesture Recognizer. Now you can get touch events like button click event on image views.
If all buttons' image look like the one (same direction), the transform value may be work.
button.transform = CGAffineTransformMakeRotation(2*M_PI-angleSize*j);
button.center = CGPointMake(radius + radius * sin(angleSize * j) / 2, radius + radius * cos(angleSize * j) / 2);

Move left and right in UIScrollView

I have a UIScrollView which scrolls only horizontally. I have a situation where I have views filled by array in UIScrollView. There are three views which altogether make one single component in UIScrollView (there are many such components). Component contains :
UILabel
UIButton
UIView (for underlying text)
I have placed two arrow keys(left and right) at the ends of UIScrollView. On touching left arrow I am shifting one position left (with complete string to display) in UIScrollView and one position right (with complete string to display) in case of right arrow button.
Till now I am able to perform left arrow action. But I have no idea how to perform right arrow touch and how to display complete string to touching arrow keys if only part of that string is being displayed.
I know it is weird that I have a UIScrollView and still want to add arrow keys to move it. But can't help it. This is client's requirement. The following is how I implemented left arrow action:
-(IBAction) onClickLeftArrow
{
NSLog(#"BUTTON VALUE : %i",iButtonValue);
if(iButtonValue <= [m_BCListArray count]) {
NSArray *arr = [scrollDemo subviews];
for(int j = 0; j < [arr count]; j++) {
UIView *view1 = [arr objectAtIndex:j];
[view1 removeFromSuperview];
}
XX = 5.0;
int tagcount = [m_BCListArray count]-iButtonValue;
NSLog(#"%#",m_BCListArray);
for(int i = iButtonValue; i >= 1; i--)
{
UILabel *blabel = [[UILabel alloc] initWithFrame:CGRectMake(XX, 6, 120, 26)];
blabel.text = [m_BCListArray objectAtIndex:[m_BCListArray count]-i];
blabel.backgroundColor = [UIColor clearColor];
blabel.textColor = [UIColor whiteColor];
blabel.font = [UIFont systemFontOfSize:14];
[scrollDemo addSubview:blabel];
//underline code
CGSize expectedLabelSize = [[m_BCListArray objectAtIndex:[m_BCListArray count]-1] sizeWithFont:blabel.font constrainedToSize:blabel.frame.size lineBreakMode:UILineBreakModeWordWrap];
CGRect newFrame = blabel.frame;
newFrame.size.height = expectedLabelSize.height;
blabel.frame = CGRectMake(blabel.frame.origin.x, blabel.frame.origin.y, expectedLabelSize.width+10, expectedLabelSize.height);
blabel.numberOfLines = 1;
[blabel sizeToFit];
int width=blabel.bounds.size.width;
int height=blabel.bounds.size.height;
UIButton *btnContent = [UIButton buttonWithType:UIButtonTypeCustom];
[btnContent addTarget:self action:#selector(SelectButton:)forControlEvents:UIControlEventTouchDown];
btnContent.tag = tagcount+1;
btnContent.frame=CGRectMake(XX, 2.0, width+10, height);
[scrollDemo addSubview:btnContent];
scrollDemo.contentSize = CGSizeMake(XX+50, 32);
//scrollDemo.contentSize = CGSizeMake(expectedLabelSize.width,expectedLabelSize.height);
UIView *viewUnderline=[[UIView alloc] init];
viewUnderline.frame=CGRectMake(XX, 26, width, 1);
viewUnderline.backgroundColor=[UIColor whiteColor];
[scrollDemo addSubview:viewUnderline];
[viewUnderline release];
scrollDemo.contentSize = CGSizeMake(XX+width+10, 32);
XX = XX + width+10;
iRight = iRight + 1;
tagcount ++;
// iRight --;
}
}
iButtonValue = iButtonValue+1;
}
Set the contentOffset of UIScrollView on the Button click action and u'll get your desired effect.

iPhone: How to scroll random height UIView in ScrollView?

I have ScrollView and UIView created in interface builder (but can as well be code). I want to add random amount of thumbnails (subviews) to UIView and be able to scroll it up-down if there are more than the screen can take. Hovewer, I can't get ScrollView to scroll.
Where and how do I resize UIView and add it as a subview of ScrollView?
When do I set contentSize of scrollView to make it expand along with uiview? I tried creating fixed large contentSize but didn't work as well.
What properties in IB I might need to change to make it work?
I'd like to make the images in uiview clickable in next step.
I guess I could also make both view in code without IB. Just somehow can't get it to work.
Thanks in advance !
//declare base view
UIViewController *viewForLoadForm =[[UIViewController alloc] init];
viewForLoadForm.view.frame=CGRectMake(0, 0,screenSize.size.width,screenSize.size.height);
viewForLoadForm.view.backgroundColor=[UIColor blackColor];
[Manview.view addSubview:viewForLoadForm];
//declare scrollview and add to base view
UIScrollView *scrollview=[[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, screenSize.size.width,screenSize.size.height)];
scrollview.indicatorStyle=UIScrollViewIndicatorStyleBlack;
[scrollview setContentSize:CGSizeMake(screenSize.size.width,screenSize.size.height)];
scrollview.clipsToBounds = NO;
scrollview.scrollEnabled = YES;
scrollview.pagingEnabled = NO; scrollview.showsVerticalScrollIndicator =NO;
scrollview.alwaysBounceVertical= YES;
[viewForLoadForm.view addSubview:scrollview];
//Add your controls to scrollview that s image view or something which is needed to display
.........your control's code (textbox,imageview etc)
//took last control's y postion and set your K
float k=Last control's y position +100;(some thing which ll be decide scroll size)
// reassign the scrollview height
[scrollview setContentSize:CGSizeMake(screenSize.size.width,k)];
use above line for scroll view size adjustment at run time.
screenSize.size.width is 320 here
code snippet,
- (void) createThumbView
{
float y_axis = Set y axis;
int x = 0;
int totalImgs = total images;
int tempCnt = 0;
for (int i = 0; i < totalImgs;)
{
float x_axis = set x axis;
int loopCount = 0;
if (totalImgs - tempCnt >= (no of images in row))
{
loopCount = (no of images in row);
}
else
{
loopCount = totalImgs % (no of images in row);
}
for (int j = 0; j < loopCount; j++)
{
MasksData *mData = [masksList objectAtIndex:x];
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(x_axis, y_axis, width, height);
[btn setImage:[UIImage imageNamed:[NSString stringWithFormat:#"%#.png",mData.bgImage]] forState:UIControlStateNormal];
btn.backgroundColor = [UIColor clearColor];
btn.tag = x;
[scroll View addSubview:btn];
//photoCount++;
x_axis += width + some space;
tempCnt++;
i++;
x++;
}
y_axis += height + some space;
scroll View.contentSize = CGSizeMake(320.0, y_axis);
}
}