add UIWebView programmatically to UIImageView - objective-c

I would like to be able to add zoom functionality to UIImage and believe the best way is to embed within UIWebview. Would someone be able to help me achieve this?
- (void)viewDidLoad
{
[super viewDidLoad];
// image
self.imageView = [[UIImageView alloc] initWithFrame:CGRectMake(10, 70, IMGSIZE.width, IMGSIZE.height)];
[self.imageView setClipsToBounds:YES];
self.imageView.layer.borderColor = kITBarTint.CGColor;
self.imageView.layer.borderWidth = 1.0;
self.imageView.layer.cornerRadius = 15.0;
self.imageView.layer.shadowColor = [UIColor blackColor].CGColor;
self.imageView.layer.shadowOffset = CGSizeMake(5, 5);
self.imageView.layer.shadowRadius = 10;
[self.controller.view addSubview:self.imageView];
// activity indicator
CGRect frame = CGRectMake(roundf(IMGSIZE.width / 2) + self.imageView.frame.origin.x, roundf(IMGSIZE.height /2) + self.imageView.frame.origin.y, 0, 0);
_activityIndicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhiteLarge];
[_activityIndicator setFrame:frame];
[_activityIndicator startAnimating];
[self.controller.view addSubview:_activityIndicator];
}

Try adding this to your viewDidLoad method,
scrollView.minimumZoomScale = 0.4;
scrollView.maximumZoomScale = 4.0;
scrollView.delegate = self;
[scrollView setZoomScale:scroll.minimumZoomScale];
Hope this helps!!
And try using a UIScrollView

You don't need to Use a UIImageview additionally.
For Local files use file:// as url. you can get a path of a file width:
NSString *path = [[NSBundle mainBundle] pathForResource:#"myimage" ofType:#"jpg"];
For the Webview simple create a Html Code as String.
[webView loadHTMLString: [NSString stringWithFormat:#"<html><head></head><body><img src=\"file://%#\"></body></html>",path] baseURL:nil];
Inside the HTML String you can also use CSS for sizing or positioning!

Related

Cannot scroll in UIWebView in iOS

I created a webview programmatically and I am unable to enable scrolling in this view.
How do I enable scrolling?
UIWebView *webView = [[UIWebView alloc] initWithFrame:CGRectMake(0,40, 325, 1000)];
webView.contentMode = UIViewContentModeScaleAspectFit;
[webView setBackgroundColor:[UIColor clearColor]];
[webView loadHTMLString:html baseURL:nil];
[self.view insertSubview:webView atIndex:0];
Thanks In Advance !
To enable scrolling,
webview.scrollView.scrollEnabled = TRUE;
and instead of writing this,
webView.contentMode = UIViewContentModeScaleAspectFit;
write this,
webview.scalesPageToFit = TRUE;
These are the possible solutions.
i) You webview may be large in size than you expected or your content is lesser than the webview size.
2) Implement following method.
func webViewDidFinishLoad(webView: UIWebView)
{
appDelegate.hideLoadingView()
let res: NSString = webView.stringByEvaluatingJavaScriptFromString("document.body.offsetHeight;")!
let h: CGFloat = CGFloat(res.integerValue)
agreementContentView.scrollView.contentSize = CGSizeMake(webView.frame.size.width, h + 50); // Offset if required
}
Removing from Interface Builder and adding via code did for me. For some reason in IB it wasn't scrolling.
UIWebView *webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 64, 320, 50)];
[self.view addSubview: webView];

Activity Indicator while loading images inside UIScrollView

I have UIScrollView that contains images from the server.
I should put Activity Indicator while the image is currently loading.
UIScrollView contains dynamic number of images from the server.
May I know how can I add activity indicators on each page while the image is loading and remove once image is loaded.
Here's my code to retrieve images:
NSDictionary *items = [NSDictionary dictionaryWithObject:dictInfo forKey:#"images"];
imageList = [items objectForKey:#"images"];
NSArray *img = [imageList objectForKey:#"list"];
NSInteger imgCount = [img count];
buttonArray = [[NSMutableArray alloc] init];
for (int i=0; i<imgCount; i++) {
NSDictionary *imgDict = [img objectAtIndex:i];
// REQUEST FOR IMAGES
NSString *imgPath = [imgDict objectForKey:#"image_slot"];
NSString *imgURL = imgPath;
__block ASIHTTPRequest *requestImage = [ASIHTTPRequest requestWithURL:[NSURL URLWithString:imgURL]];
[requestImage setCompletionBlock:^{
imgView = [UIImage imageWithData:[requestImage responseData]];
if (imgURL.length) {
[pendingRequests removeObjectForKey:imgURL];
}
scrollView.userInteractionEnabled = YES;
scrollView.exclusiveTouch = YES;
scrollView.canCancelContentTouches = YES;
scrollView.delaysContentTouches = YES;
scrollView.bounces = NO;
CGRect frame;
frame.origin.x = self.scrollView.frame.size.width * i;
frame.origin.y = 0;
frame.size = self.scrollView.frame.size;
SWTUIButton *imgBtn = [[SWTUIButton alloc] initWithFrame:frame];
imgBtn.url = [requestImage.userInfo objectForKey:#"rURL"];
[imgBtn setImage:imgView forState:UIControlStateNormal];
imgBtn.backgroundColor = [UIColor clearColor];
[imgBtn addTarget:self action:#selector(buttonpushed:) forControlEvents:UIControlEventTouchUpInside];
[scrollView addSubview:imgBtn];
[buttonArray addObject:imgBtn];
[imgBtn release];
self.scrollView.contentSize = CGSizeMake(self.scrollView.frame.size.width * img.count, self.scrollView.frame.size.height);
}];
I highly suggest you use NINetworkImageView from https://github.com/jverkoey/nimbus project.
It's very light and useful.
It has a delegate method to let you know when an image is loaded.
What you basically need to do is:
1. create an NINetworkImageView for each page, just like you do with UIImageView, and call set
NINetworkImageView* networkImageView = [[[NINetworkImageView alloc] initWithImage:initialImage]
autorelease];
networkImageView.delegate = self;
networkImageView.contentMode = UIViewContentModeCenter;
[networkImageView setPathToNetworkImage:
#"http://farm3.static.flickr.com/2484/3929945380_deef6f4962_z.jpg"
forDisplaySize: CGSizeMake(kImageDimensions, kImageDimensions)];
https://github.com/jverkoey/nimbus/tree/master/examples/photos/NetworkPhotoAlbums
the add the indicator to the networkImageView as a subview.
implement the delegate as follows:
-(void)networkImageView:(NINetworkImageView *)imageView didLoadImage:(UIImage *)image {
[imageView removeAllSubviews];
}
the end result would be a much smaller code for doing the same thing.

How to use UIPageControl with iCarousel?

I have some images within icarousel. (about 20 images)
I wanna 5 images in a page.
There is no problem about image pixel or image location.
How to use uipagecontrol WITHOUT ScrollView?
ex) able to use some delegate methods.. and so on.
carousel.type = iCarouselTypeLinear;
carousel = [[iCarousel alloc] initWithFrame:CGRectMake(0, 504, 1024, 164)];
carousel.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"10004.png"]];
carousel.delegate = self;
carousel.dataSource = self;
[self.view addSubview:carousel];
[carousel reloadData];
[carousel release];
UIView *bandImageView = [[UIView alloc] initWithFrame:CGRectMake(0, 668, 1024, 20)];
bandImageView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"10001.png"]];
[self.view addSubview:bandImageView]; // page dots in
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.frame = CGRectMake(434, 0, 150, 20);
pageControl.numberOfPages = 6;
pageControl.currentPage = 0;
[bandImageView addSubview:pageControl];
[pageControl release];
In the iCarousel carouselCurrentItemIndexUpdated: delegate method, set
pageControl.currentPage = carousel.currentItemIndex / 5
Then bind your pageControl action to a method like the one below:
- (IBAction)updatePage:(UIPageControl *)pageControl
{
[carousel scrollToItemAtIndex:pageControl.currentPage * 5 aimated:YES];
}
If you're not using a nib file, you can bind the action using
[pageControl addTarget:self action:#selector(updatePage:) forControlEvents:UIControlEventValueChanged];
It's a good idea to set pageControl.defersCurrentPageDisplay = YES; as well to avoid flicker.

Trying to display images using UIScrollView

I want to create an simple app that will contain one centered image at the first start screen, than upon swipe gesture(right, left) change images.
I'm very new to this so here is what I though is what I'm looking for http://idevzilla.com/2010/09/16/uiscrollview-a-really-simple-tutorial/ .
This is the code I have in my controller implementation :
- (void)viewDidLoad
{
[super viewDidLoad];
NSMutableDictionary *myDictionary = [[NSMutableDictionary alloc] init];
[myDictionary setObject:#"img1.jpg" forKey:#"http://www.testweb.com"];
[myDictionary setObject:#"img2.jpg" forKey:#"http://www.test2.com"];
UIScrollView *scroll = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
scroll.pagingEnabled = YES;
NSInteger numberOfViews = [myDictionary count];
for (NSString* key in myDictionary) {
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:[myDictionary objectForKey:key]]];
CGRect rect = CGRectMake(10.0f, 90.0f, image.size.width, image.size.height);
UIImageView * imageView = [[UIImageView alloc] initWithFrame:rect];
[imageView setImage:image];
CGPoint superCenter = CGPointMake([self.view bounds].size.width / 2.0, [self.view bounds].size.height / 2.0);
[imageView setCenter:superCenter];
self.view.backgroundColor = [UIColor whiteColor];
[scroll addSubview:imageView];
}
scroll.contentSize = CGSizeMake(self.view.frame.size.width * numberOfViews, self.view.frame.size.height);
[self.view addSubview:scroll];
}
My first issue here is that I get img2 on my initial screen instead of img1. And second issue is when I swipe right I get white screen and no image on it. Any suggestions what I missed, what I can try/read etc?
EDIT :
I'm looking to do this the "lightest" possible way, using no fancy galleries api etc. Just display couple of really small images(i.e 200x200 px) centered on the screen that I can swipe back and forth(should't be too hard). Well everything is hard when learning a new language.
There is a project on github MWPhotoBrowser that allows you to put in a set of images which are viewed one at a time. You can then scroll from one image to the next with a swipe gesture. It is also easy to add functionality and it should give you a good understanding of how this is done. There is also Apple's PhotoScroller example which gives you straight forward code in how to do this same thing and also tile your images. Since you are new to iOS you may want to first look at both of these examples or possibly just use them as your photo viewer.
Your problem is likely to be the fact that you are setting CGRect rect = CGRectMake(10.0f, 90.0f, image.size.width, image.size.height); for both of your image views. This means that both of your UIImageView objects are placed in exactly the same position (both are positioned at 10.f on the x-coordinate of the scrollview). As the second image view is added last it covers the first and means that there is white space to the right of it.
In order to fix this you could try something like...
- (void)viewDidLoad
{
//your setup code
float xPosition = 10.f;
for (NSString* key in myDictionary) {
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:[myDictionary objectForKey:key]]];
CGRect rect = CGRectMake(xPosition, 90.0f, image.size.width, image.size.height);
xPosition += image.size.width;
//rest of your code...
}
//rest of your code
}
The above would mean that the second view is positioned on the x-coordinate at 10 + the width of the first image. Note that I haven't tested my answer.
First off the images are placed on top of each other.
CGPoint superCenter = CGPointMake([self.view bounds].size.width / 2.0, [self.view bounds].size.height / 2.0);
[imageView setCenter:superCenter];
Right here you are setting both images to be placed at the center of the screen. The second thing is your using an NSDictionary and looping through the keys. NSDictionary are not orders like an array is. You would have to sort the keys to us it in a specific order. So Barjavel had it right but skipped over the fact your setting the images to center. Try this:
- (void)viewDidLoad
{
[super viewDidLoad];
NSArray *myArray = [[NSArray alloc] initWithObjects:#"img1.jpg", #:image2.jpg", nil];
UIScrollView *scroll = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
scroll.pagingEnabled = YES;
NSInteger numberOfViews = [myArray count];
int xPosition = 0;
for (NSString* image in myArray) {
UIImage * image = [UIImage imageNamed:image];
CGRect rect = CGRectMake(xPosition, 90.0f, image.size.width, image.size.height);
UIImageView * imageView = [[UIImageView alloc] initWithFrame:rect];
[imageView setImage:image];
self.view.backgroundColor = [UIColor whiteColor];
[scroll addSubview:imageView];
xPosition += image.size.width;
}
scroll.contentSize = CGSizeMake(self.view.frame.size.width * numberOfViews, self.view.frame.size.height);
[self.view addSubview:scroll];
}

Content change when UIWebView load inside ScrollView

I want to make something like Pulse news when user read the selected news.
When image is not loaded, the space for the image is not yet specified. After the image is loaded, the size of the content also change (the text will be pushed down to make space for the image).
How can i do that?
What i do now is using scroll view, with uiwebview inside it.
- (void)loadView
{
self.view = [[UIView alloc] initWithFrame:CGRectZero];
UIView *thisView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
contentTitleLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, 5, 292, 82)];
contentThumbnailWebView = [[UIWebView alloc] initWithFrame:CGRectMake(10, CGRectGetMaxY(contentTitleLabel.frame), 292, 0)];
contentDateLabel = [[UILabel alloc]initWithFrame:CGRectMake(10, CGRectGetMaxY(contentThumbnailWebView.frame), 292, 23)];
playVideoButton = [[UIButton alloc] initWithFrame:CGRectMake(CGRectGetMaxX(contentThumbnailWebView.frame)/2, CGRectGetMaxY(contentThumbnailWebView.frame)/2, 72, 37)];
[playVideoButton setTitle:#"Play" forState:UIControlStateNormal];
playVideoButton.hidden = YES;
contentSummaryLabel = [[UILabel alloc] initWithFrame:CGRectMake(10, CGRectGetMaxY(contentDateLabel.frame), 292, 20)];
contentScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
contentScrollView.backgroundColor = [UIColor whiteColor];
[thisView addSubview:contentScrollView];
[contentScrollView addSubview:contentDateLabel];
[contentScrollView addSubview:contentTitleLabel];
[contentScrollView addSubview:contentThumbnailWebView];
[contentScrollView addSubview:playVideoButton];
[contentScrollView addSubview:contentSummaryLabel];
//[self.view addSubview:thisView];
self.view = thisView;
contentThumbnailWebView.delegate = self;
}
I've read several topics about this but i still cannot solve it.
- (void)webViewDidFinishLoad:(UIWebView *)aWebView {
CGRect frame = aWebView.frame;
frame.size.height = 1;
aWebView.frame = frame;
CGSize fittingSize = [aWebView sizeThatFits:CGSizeZero];
fittingSize.width = aWebView.frame.size.width;
frame.size = fittingSize;
aWebView.frame = frame;
NSLog(#"size: %f, %f", fittingSize.width, fittingSize.height);
[contentDateLabel setFrame:CGRectMake(10, CGRectGetMaxY(aWebView.frame), 292, 23)];
playVideoButton = [[UIButton alloc] initWithFrame:CGRectMake(CGRectGetMaxX(aWebView.frame)/2, CGRectGetMaxY(aWebView.frame)/2, 72, 37)];
[contentSummaryLabel setFrame:CGRectMake(10, CGRectGetMaxY(contentDateLabel.frame), 292, contentSummaryLabel.frame.size.height )];
contentScrollView.contentSize = CGSizeMake(contentScrollView.frame.size.width, CGRectGetMaxX(contentSummaryLabel.frame));
}
I load jpg image link on it. The image is loaded but the height is not resize correctly. and i also cannot scroll again the scrollView when the webview is loaded.
Below is when i call the image to be loaded
- (void) setImageAsThumbnail:(NSString *)imagehumbnailLink
{
NSURL *imageURL = [NSURL URLWithString:imageThumbnailLink];
NSString *cssString = #"<style type='text/css'>img {width: 292px; height: auto;}</style>";
NSString *myHTMLContent = #"<html><head></head><body><img src='%#'></body></html>";
NSString *htmlString = [NSString stringWithFormat:#"%#%#",cssString,myHTMLContent];
NSString *imageHTML = [[NSString alloc] initWithFormat:htmlString, imageURL];
contentThumbnailWebView.scalesPageToFit = YES;
[contentThumbnailWebView loadHTMLString:imageHTML baseURL:nil];
}
Thank you!
I frequently use UIWebView inside UIScrollView, and because loading HTML is done asynchronously you have to resize the web view and the content size of the scroll view when finished.
[webView sizeThatFits:CGSizeZero]
does not work for me either. Instead, in your webViewDidFinishLoad:(UIWebView*)webView you can measure the size of the HTML document by executing a piece of Javascript:
NSString *js = #"document.getElementById('container').offsetHeight;";
NSString *heightString = [webView stringByEvaluatingJavaScriptFromString:js];
int height = [heightString intValue]; // HTML document height in pixels
In this example, you have to assign the ID 'container' to the top-level element in your HTML (make sure there are no margins around it). This approach works very well for me.