Iam beginner in IOS Dev. asking about a way to make UIScrollView images scrolls by dragging UISlider . This is my case :
Required case :
when dragging slider , images scrolls on UIScrollView . also when scrolling images , slider changes its value accordingly .
Actual case :
when scrolling images , slider changes its value accordingly BUT when dragging slider images DONOT Scroll .
Here is my code , I wish any one tell me how to scrolling when slider drags .
Slider IBAction
- (IBAction)sliding:(UISlider *)sender{
int slider_value = (int)slider.value;
NSString *current_page = [[NSString alloc] initWithFormat:#"%i",slider_value];
current_page_lbl.text = current_page ;
[self loadPage:slider_value];
[self loadVisiblePages];
}
methods for UIScrollview :
- (void)loadPage:(NSInteger)page {
if (page < 0 || page >= self.pageImages.count) {
return;
}
UIView *pageView = [self.pageViews objectAtIndex:page];
if ((NSNull*)pageView == [NSNull null]) {
CGRect frame = self.scrollView.bounds;
frame.origin.x = frame.size.width * page;
frame.origin.y = 0.0f;
UIImageView *newPageView = [[UIImageView alloc] initWithImage:[self.pageImages objectAtIndex:page]];
newPageView.contentMode = UIViewContentModeScaleAspectFit;
newPageView.frame = frame;
[self.scrollView addSubview:newPageView];
[self.pageViews replaceObjectAtIndex:page withObject:newPageView];
}
}
- (void)purgePage:(NSInteger)page {
if (page < 0 || page >= self.pageImages.count) {
// If it's outside the range of what you have to display, then do nothing
return;
}
UIView *pageView = [self.pageViews objectAtIndex:page];
if ((NSNull*)pageView != [NSNull null]) {
[pageView removeFromSuperview];
[self.pageViews replaceObjectAtIndex:page withObject:[NSNull null]];
}
}
To loadVisiblePage
- (void)loadVisiblePages {
CGFloat pageWidth = self.scrollView.frame.size.width;
NSInteger page = (NSInteger)floor((self.scrollView.contentOffset.x * 2.0f + pageWidth) / (pageWidth * 2.0f));
NSLog(#"page loaded is %d",page);
self.pageControl.currentPage = page;
NSInteger firstPage = page - 1;
NSInteger lastPage = page + 1;
for (NSInteger i=0; i<firstPage; i++) {
[self purgePage:i];
}
for (NSInteger i=firstPage; i<=lastPage; i++) {
[self loadPage:i];
slider.value = 21-i ;
int slider_value = (int)slider.value;
NSString *current_page = [[NSString alloc] initWithFormat:#"%i",21-slider_value];
current_page_lbl.text = current_page ;
}
for (NSInteger i=lastPage+1; i<self.pageImages.count; i++) {
[self purgePage:i];
}
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
[self loadVisiblePages];
}
uislider is not suitable to use with uiscrollview....for this purpose there is one controll available name UIPagecontrol..
following link is the nice example with code which direct you to how to use it with UIScollview
UIPagecontroll with UIscollview with code Click Here
Related
In my efforts to upgrade my application to support IOS7 I found out that UIPageControl doesn't support the UIImageView. They have changed it.
I'm subclassing the UIPageControl in order to put custom circles instead the regular ones (attached an example)
My class is:
- (id)initWithFrame:(CGRect)frame
{
// if the super init was successfull the overide begins.
if ((self = [super initWithFrame:frame]))
{
// allocate two bakground images, one as the active page and the other as the inactive
activeImage = [UIImage imageNamed:#"active_page_image.png"];
inactiveImage = [UIImage imageNamed:#"inactive_page_image.png"];
}
return self;
}
// Update the background images to be placed at the right position
-(void) updateDots
{
for (int i = 0; i < [self.subviews count]; i++)
{
UIImageView* dot = [self.subviews objectAtIndex:i];
if (i == self.currentPage) dot.image = activeImage;
else dot.image = inactiveImage;
}
}
// overide the setCurrentPage
-(void) setCurrentPage:(NSInteger)page
{
[super setCurrentPage:page];
[self updateDots];
}
Now in the IOS7 I got the following error:
*** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[UIView setImage:]: unrecognized selector sent to instance 0xe02ef00'
and after investigating I understood that the following code cause the error:
UIImageView* dot = [self.subviews objectAtIndex:i];
if (i == self.currentPage) dot.image = activeImage;
else dot.image = inactiveImage;
I checked the subviews and saw that it is UIView instead of UIImageView. probably Apple changed something.
Any idea how to fix it?
It looks like they changed the subviews to standard UIViews. I managed to work around it by doing this:
for (int i = 0; i < [self.subviews count]; i++)
{
UIView* dotView = [self.subviews objectAtIndex:i];
UIImageView* dot = nil;
for (UIView* subview in dotView.subviews)
{
if ([subview isKindOfClass:[UIImageView class]])
{
dot = (UIImageView*)subview;
break;
}
}
if (dot == nil)
{
dot = [[UIImageView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, dotView.frame.size.width, dotView.frame.size.height)];
[dotView addSubview:dot];
}
if (i == self.currentPage)
{
if(self.activeImage)
dot.image = activeImage;
}
else
{
if (self.inactiveImage)
dot.image = inactiveImage;
}
}
maybe dot isn't kind of UIImageView, so try like this
UIImageView* dot = [self.subviews objectAtIndex:i];
if ([dot isKindOfClass:[UIImageView class]]) {
if (i == self.currentPage)
dot.image = activeImage;
else
dot.image = inactiveImage;
}
I've got a bit cleaner solution:
for (int i = 0; i < [self.subviews count]; i++) {
UIView *dotView = [self.subviews objectAtIndex:i];
if ([dotView isKindOfClass:[UIImageView class]]) {
UIImageView* dot = (UIImageView*)dotView;
dot.frame = CGRectMake(dot.frame.origin.x, dot.frame.origin.y, _activeImage.size.width, _activeImage.size.height);
if (i == self.currentPage)
dot.image = _activeImage;
else
dot.image = _inactiveImage;
}
else {
dotView.frame = CGRectMake(dotView.frame.origin.x, dotView.frame.origin.y, _activeImage.size.width, _activeImage.size.height);
if (i == self.currentPage)
[dotView setBackgroundColor:[UIColor colorWithPatternImage:_activeImage]];
else
[dotView setBackgroundColor:[UIColor colorWithPatternImage:_inactiveImage]];
}
}
The idea is instead of adding subview to UIView for iOS7 just set UIView background image.
Just a little refactor for devgeek's solution to make it a bit more compact
for (int i = 0; i < [self.subviews count]; i++) {
UIImage *customDotImage = (i == self.currentPage) ? _activeDot : _inactiveDot;
UIView *dotView = [self.subviews objectAtIndex:i];
dotView.frame = CGRectMake(dotView.frame.origin.x, dotView.frame.origin.y, customDotImage.size.width, customDotImage.size.height);
if ([dotView isKindOfClass:[UIImageView class]]) { // in iOS 6, UIPageControl contains UIImageViews
((UIImageView *)dotView).image = customDotImage;
}
else { // in iOS 7, UIPageControl contains normal UIViews
dotView.backgroundColor = [UIColor colorWithPatternImage:customDotImage];
}
}
Just override layoutSubviews in your subclass of UIPageControl
- (void) layoutSubviews
{
[super layoutSubviews];
for (UIView* dot in self.subviews)
{
CGRect f = dot.frame;
//sets all the dots to be 5x5
f.size = CGSizeMake(5, 5);
//need to reposition vertically as the dots get repositioned when selected
f.origin.y = CGRectGetMidY(self.bounds) - CGRectGetHeight(f)/2;
dot.frame = f;
//update the cornerRadius to be sure that they are perfect circles
dot.layer.cornerRadius = CGRectGetWidth(f)/2;
}
}
I tried to implement paging with 2 views from this tutorial:
Multiple virtual pages in a UIScrollView with just 2 child views
I wanted to modify this by putting UIScrollView to pages and in every page updating it with new content:
-(void)addContent:(NSString*)txt{
int size = 5;
UITextView *txtView;
int row = 0;
//from left
int xPlace = 0;
//space between row's
int rowSpace = 20;
//from top
int yPlace = 10;
// int button_with = scrollView.frame.size.width;
int button_height = 20;
for (int i = 0; i < size; i++) {
txtView = [[UITextView alloc] initWithFrame:CGRectMake(xPlace, row*rowSpace+yPlace, scrollView.frame.size.width, 2*button_height)];
[txtView setFont:[UIFont fontWithName:#"ArialMT" size:14]];
txtView.backgroundColor = [UIColor blueColor];
[txtView setText:[NSString stringWithFormat:#"Numer %# - %i",txt,i]];
// answerCheck.titleLabel.font = [UIFont boldSystemFontOfSize:fontSize];
[scrollView addSubview:txtView];
[txtView release];
row++;
}
[scrollView setContentSize:CGSizeMake(scrollView.frame.size.width, txtView.frame.size.height*size)];
}
The idea is when scrolling just replace uiviewcontroller with new content. It calls:
- (void)setPageIndex:(NSInteger)newPageIndex
{
pageIndex = newPageIndex;
if (pageIndex >= 0 && pageIndex < [[DataSource sharedDataSource] numDataPages])
{
NSDictionary *pageData =
[[DataSource sharedDataSource] dataForPage:pageIndex];
label.text = #"Tekstas";//[pageData objectForKey:#"pageName"];
textView.text = [pageData objectForKey:#"pageText"];
[self addContent:[pageData objectForKey:#"pageText"]];
CGRect absoluteRect = [self.view.window
convertRect:textView.bounds
fromView:textView];
if (!self.view.window ||
!CGRectIntersectsRect(
CGRectInset(absoluteRect, TEXT_VIEW_PADDING, TEXT_VIEW_PADDING),
[self.view.window bounds]))
{
textViewNeedsUpdate = YES;
}
}
}
Well here I stuck. My text view is updating but new content of UIscrollView don't update in iPad simulator.
Yea I mean in iphone it works while in iPad it don't. What I could improve if I want to achieve this functionality?
Maybe there are other way to do paging from iOS 5?
I would put source that a tried to make working.
Download source
You can just use a nib file add a UIScrollView with fix width and height. Now make some pages as a UIView and add them to UIScrollView with same size and same origin. In the main UIView:
- (void)viewDidLoad
{
[super viewDidLoad];
scrollView.contentSize = CGSizeMake(scrollView.frame.size.width, scrollView.frame.size.height * 2);
}
-(void)viewWillAppear:(BOOL)animated{
CGFloat h = scrollView.frame.size.height;
[pageView1 setFrame:CGRectMake(0, 0, pageView1.frame.size.width, pageView1.frame.size.height)];
[pageView2 setFrame:CGRectMake(0, h, pageView2.frame.size.width, pageView2.frame.size.height)];
}
And don't forget to check Paging Enabled for UIScrollView in the Attributes in the nib file.
I hope be useful for you!
I've created a UIScrollView with paging containing several images, with 1 image per "page", and i was wondering if there were any way to distinguish the images from each other?
Fx. when the first image is showing, I would have a button to set a UILabel to '1' and when the second image is showing, the same button would set the same UILabel to '2'.
Here's my code:
pictures = [NSArray arrayWithObjects: [UIImage imageNamed:#"AND.png"], [UIImage imageNamed:#"ALB.png"], nil];
for (int i = 0; i < pictures.count; i++) {
CGRect frame;
frame.origin.x = 135 + (self.scrollViewQuiz.frame.size.width * i);
frame.origin.y = 40;
frame.size = CGSizeMake(50, 50);
UIImageView *subview = [[UIImageView alloc] initWithFrame:frame];
subview.image = [pictures objectAtIndex:i];
[self.scrollViewQuiz addSubview:subview];
}
self.scrollViewQuiz.contentSize = CGSizeMake(self.scrollViewQuiz.frame.size.width * pictures.count, self.scrollViewQuiz.frame.size.height);
It sounds like you just want to compute the "page number" that the scroll view is currently displaying. You can try something like this as your button's action:
- (IBAction)buttonWasTapped:(id)sender {
UIScrollView *scrollView = self.scrollViewQuiz;
int pageNumber = (int)roundf(scrollView.contentOffset.x / scrollView.bounds.size.width);
self.label.text = [NSString stringWithFormat:#"%d", pageNumber];
}
You could implement the following scrollview delegate method:
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
In it you would examine the scrollview's contentOffset and set the label accordingly.
Try these two.. these should work.. hope this helps..
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
CGFloat xOffset = scrollView.contentOffset.x;
int currentPage = floor(xOffset / scrollView.bounds.size.width);
[itsLabel setText:[NSString stringWithFormat:#"%i", currentPage]];
}
- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView {
CGFloat xOffset = scrollView.contentOffset.x;
int currentPage = floor(xOffset / scrollView.bounds.size.width);
[itsLabel setText:[NSString stringWithFormat:#"%i", currentPage]];
}
I have a scroll view that contains image view sized 68x78:
As you could see, all that images except from the centered one have a shadow. It changes when user scrolls, center image is always clear. It goes perfect until for the left edge image:
Here is the code:
-(void) buildSlideView{
fotosJugadores = [[NSArray alloc] initWithObjects:#"cara5.png", #"cara7.png", #"cara8.png", #"cara9.png", #"cara11.png", #"cara13.png", #"cara14.png", #"cara15.png", #"cara18.png",#"cara19.png", #"cara20.png", #"cara32.png",#"cara44.png",#"cara51.png", #"cara100.png", #"cara101.png", #"cara102.png",#"cara103.png", #"cara104.png", #"cara105.png",#"cara106.png",#"cara107.png", nil];
numberOfViews = [fotosJugadores count];
for (int i = 0; i < [fotosJugadores count]; i++) {
UIImage *myImage = [UIImage imageNamed:[fotosJugadores objectAtIndex:i]];
CGFloat yOrigin = i * (myImage.size.width+3) + 120;
UIImageView *awesomeView = [[UIImageView alloc] initWithFrame:CGRectMake(yOrigin, 0, myImage.size.width, myImage.size.height)];
awesomeView.tag = i;
awesomeView.image = myImage;
awesomeView.alpha = 0.5f;
awesomeView.backgroundColor = [UIColor blackColor];
[self.jugadorSlide addSubview:awesomeView];
awesomeView=nil;
}
[jugadorSlide setBackgroundColor:[UIColor blackColor]];
jugadorSlide.contentSize = CGSizeMake(68 * numberOfViews+240,78);
jugadorSlide.layer.cornerRadius = 11;
jugadorSlide.layer.masksToBounds = YES;
[jugadorSlide setContentOffset:CGPointMake(((68 * numberOfViews)/2), 0)];
//jugadorSlide.decelerationRate = UIScrollViewDecelerationRateNormal;
[self scrollViewDidEndDragging:jugadorSlide willDecelerate:NO];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
currentIndex = roundf(scrollView.contentOffset.x / 68);
NSLog(#"current end %d", currentIndex);
UIImageView *currentImage = [scrollView viewWithTag:currentIndex];
if (currentIndex>0&¤tIndex<=21){
if (currentIndex==currentImage.tag){
currentImage.alpha=1.0f;
[self changePerfilImage:currentImage.tag];}
CGPoint pointZero= CGPointMake(scrollView.contentOffset.x, currentImage.frame.origin.y);
[jugadorSlide setContentOffset:pointZero animated:YES];
}else {
UIImageView *currentImage = [scrollView viewWithTag:0];
NSLog(#"end dragging image tag %d", currentImage.tag);
currentImage.alpha=1.0f;
[self changePerfilImage:currentImage.tag];}
CGPoint pointZero= CGPointMake(currentImage.frame.origin.x+15, 0);
//[jugadorSlide setContentOffset:pointZero animated:YES];
}
As you can see, in the scrollViewDidEndDragging: "else" , I forced the tag as a desesperate solution, but images doesn't get clear.
You are incrementing the tag twice...
awesomeView.tag = i++;
Should just be:
awesomeView.tag = i+1;
I use i+1 because I never use a tag of 0 since any subview that hasn't been assigned a tag will have a tag of 0.
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
NSInteger currentIndex = roundf(scrollView.contentOffset.x / 68.0) + 1;
UIImageView *currentImage = [scrollView viewWithTag:currentIndex];
...
}
If this doesn't work you should NSLog the currentIndex each time you land on a new image and see what is happening when you land on the first one.
I am making a day view calendar just like the native iPhone calendar. I am trying to position the tiles the same as in the native calendar, side by side, if they are the same size and same time.
However, I can only figure out how to do it to 2 tiles and not multiple tiles. In the attached image I have 4 tiles. One that expands slightly into the other 3. I then have the first tile on the far left and the second tile just after the first one. Now I need to figure out how to add the additional tiles?
How would I do this for more than 2 tiles?
About the image: If you can't see it the 3rd tile is ontop of the 2nd tile (you can see it is a bit darker since they are on top of each other.
- (void)layoutSubviews
{
// Set the main
for (UIView *view in self.subviews) {
APCalendarDayTile *tile = (APCalendarDayTile *)view;
CGFloat startPos = [APCalendarCurrentDayView yAxisForTime:[APCalendarCurrentDayView minutesToTime:tile.appointment.startDate]];
CGFloat endPos = [APCalendarCurrentDayView yAxisForTime:[APCalendarCurrentDayView minutesToTime:tile.appointment.endDate]];
tile.frame = CGRectMake(kLeftSideBuffer, startPos, (self.bounds.size.width - kLeftSideBuffer) , endPos - startPos);
tile.backgroundColor = [UIColor colorWithHexString:tile.appointment.appointmentColor];
}
for (UIView *view in self.subviews) {
APCalendarDayTile *tile = (APCalendarDayTile *)view;
if ([self viewIntersectsWithAnotherView:tile]) {
}
}
}
- (BOOL)viewIntersectsWithAnotherView:(UIView*)selectedView{
NSArray *subViewsInView=[self subviews];// I assume self is a subclass
// of UIViewController but the view can be
//any UIView that'd act as a container
//for all other views.
for (UIView *theView in subViewsInView){
if (![selectedView isEqual:theView]) {
if(CGRectIntersectsRect(selectedView.frame, theView.frame)) {
if ((selectedView.frame.origin.y == theView.frame.origin.y) && (selectedView.frame.size.height == theView.frame.size.height)) {
if (theView.frame.size.width == self.bounds.size.width - kLeftSideBuffer) {
theView.frame = CGRectMake(theView.frame.origin.x, selectedView.frame.origin.y, theView.frame.size.width / 2, selectedView.frame.size.height);
}
selectedView.frame = CGRectMake(theView.frame.origin.x + theView.frame.size.width, selectedView.frame.origin.y, theView.frame.size.width, selectedView.frame.size.height);
return YES;
}
}
}
}
return NO;
}
It appears that your test
if ((selectedView.frame.origin.y == theView.frame.origin.y) && (selectedView.frame.size.height == theView.frame.size.height))
Is only applied to views of equal y origin and height. I would solve this problem using the following pseudo code:
initialize an empty arranged subviews array
initialize a nil previous subview
for every subview
if the subview intersects with the previous subview
ensure the subview and the previous subview are added to the arranged subviews array
else if the arranged subviews array is not empty
arrange the subviews in the array across the width of their superview
empty the arranged subview array
Ok,
I sorta took SaltyMule's approach however, his pseudo code didn't make sense in the if / else.
- (void)layoutSubviews
{
// Set the main
for (UIView *view in self.subviews) {
APCalendarDayTile *tile = (APCalendarDayTile *)view;
CGFloat startPos = [APCalendarCurrentDayView yAxisForTime:[APCalendarCurrentDayView minutesToTime:tile.appointment.startDate]];
CGFloat endPos = [APCalendarCurrentDayView yAxisForTime:[APCalendarCurrentDayView minutesToTime:tile.appointment.endDate]];
tile.frame = CGRectMake(kLeftSideBuffer, startPos, (self.bounds.size.width - kLeftSideBuffer) , endPos - startPos);
tile.backgroundColor = [UIColor colorWithHexString:tile.appointment.appointmentColor];
}
[sameTimeAppointments removeAllObjects];
for (UIView *view in self.subviews) {
APCalendarDayTile *tile = (APCalendarDayTile *)view;
if ([self viewIntersectsWithAnotherView:tile]) {
if ([sameTimeAppointments objectForKey:[NSString stringWithFormat:#"%f", tile.frame.origin.y]] != nil) {
NSMutableArray *tempArray = [[sameTimeAppointments objectForKey:[NSString stringWithFormat:#"%f", tile.frame.origin.y]] mutableCopy];
[tempArray addObject:tile];
[sameTimeAppointments setValue:tempArray forKey:[NSString stringWithFormat:#"%f", tile.frame.origin.y]];
} else {
[sameTimeAppointments setValue:[NSMutableArray arrayWithObject:tile] forKey:[NSString stringWithFormat:#"%f", tile.frame.origin.y]];
}
}
}
for (NSString *currentDict in sameTimeAppointments) {
NSArray *currentAppointments = [sameTimeAppointments objectForKey:currentDict];
float tileWidth = ((self.frame.size.width - kLeftSideBuffer) / [currentAppointments count]);
for (int i = 0; i < [currentAppointments count]; i++) {
APCalendarDayTile *tile = [currentAppointments objectAtIndex:i];
float xPos = 0.0 + kLeftSideBuffer;
if (i != 0) {
xPos = (((APCalendarDayTile *)[currentAppointments objectAtIndex:i - 1]).frame.origin.x + tileWidth);
}
tile.frame = CGRectMake(xPos, tile.frame.origin.y, tileWidth, tile.frame.size.height);
[self bringSubviewToFront:tile];
}
}
}
- (BOOL)viewIntersectsWithAnotherView:(UIView*)selectedView{
NSArray *subViewsInView=[self subviews];// I assume self is a subclass
// of UIViewController but the view can be
//any UIView that'd act as a container
//for all other views.
for (UIView *theView in subViewsInView){
if (![selectedView isEqual:theView]) {
if(CGRectIntersectsRect(selectedView.frame, theView.frame)) {
if ((selectedView.frame.origin.y == theView.frame.origin.y) && (selectedView.frame.size.height == theView.frame.size.height)) {
return YES;
}
}
}
}
return NO;
}