Skip to content

Commit

Permalink
adding a triangle at the top of the screen in the middle that points …
Browse files Browse the repository at this point in the history
…to the current page, making the font of the headers slightly bigger and bold, adding some more text to the demo headers in the demo app
  • Loading branch information
Tom Thorpe committed Apr 16, 2013
1 parent f974ffd commit 51fea9f
Show file tree
Hide file tree
Showing 5 changed files with 107 additions and 12 deletions.
6 changes: 6 additions & 0 deletions UIScrollSlidingPages.xcodeproj/project.pbxproj
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
9F2035E71706475B00438E50 /* diagmonds_@2X.png in Resources */ = {isa = PBXBuildFile; fileRef = 9F2035E41706475B00438E50 /* diagmonds_@2X.png */; };
9F2035E81706475B00438E50 /* readme.txt in Resources */ = {isa = PBXBuildFile; fileRef = 9F2035E51706475B00438E50 /* readme.txt */; };
9F2035EB170648E600438E50 /* about-tomthorpelogo.png in Resources */ = {isa = PBXBuildFile; fileRef = 9F2035EA170648E600438E50 /* about-tomthorpelogo.png */; };
9F602A67171E083F00088A9C /* TTBlackTriangle.m in Sources */ = {isa = PBXBuildFile; fileRef = 9F602A66171E083F00088A9C /* TTBlackTriangle.m */; };
9F70248A16DBF6650003B5FA /* UIKit.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 9F70248916DBF6650003B5FA /* UIKit.framework */; };
9F70248C16DBF6650003B5FA /* Foundation.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 9F70248B16DBF6650003B5FA /* Foundation.framework */; };
9F70248E16DBF6650003B5FA /* CoreGraphics.framework in Frameworks */ = {isa = PBXBuildFile; fileRef = 9F70248D16DBF6650003B5FA /* CoreGraphics.framework */; };
Expand Down Expand Up @@ -38,6 +39,8 @@
9F2035E41706475B00438E50 /* diagmonds_@2X.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "diagmonds_@2X.png"; sourceTree = "<group>"; };
9F2035E51706475B00438E50 /* readme.txt */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = readme.txt; sourceTree = "<group>"; };
9F2035EA170648E600438E50 /* about-tomthorpelogo.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "about-tomthorpelogo.png"; sourceTree = "<group>"; };
9F602A65171E083F00088A9C /* TTBlackTriangle.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = TTBlackTriangle.h; sourceTree = "<group>"; };
9F602A66171E083F00088A9C /* TTBlackTriangle.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = TTBlackTriangle.m; sourceTree = "<group>"; };
9F70248616DBF6650003B5FA /* UIScrollSlidingPages.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = UIScrollSlidingPages.app; sourceTree = BUILT_PRODUCTS_DIR; };
9F70248916DBF6650003B5FA /* UIKit.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = UIKit.framework; path = System/Library/Frameworks/UIKit.framework; sourceTree = SDKROOT; };
9F70248B16DBF6650003B5FA /* Foundation.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = Foundation.framework; path = System/Library/Frameworks/Foundation.framework; sourceTree = SDKROOT; };
Expand Down Expand Up @@ -175,6 +178,8 @@
9F936B53170650EF001622D8 /* TTSlidingPageTitle.h */,
9F936B54170650EF001622D8 /* TTSlidingPageTitle.m */,
9F9B9BA7170387BE00CD45B4 /* TTSlidingPagesDataSource.h */,
9F602A65171E083F00088A9C /* TTBlackTriangle.h */,
9F602A66171E083F00088A9C /* TTBlackTriangle.m */,
);
path = Source;
sourceTree = "<group>";
Expand Down Expand Up @@ -300,6 +305,7 @@
9F9B9BA117037C0B00CD45B4 /* TTScrollSlidingPagesController.m in Sources */,
9F9B9BA51703836D00CD45B4 /* TTSlidingPage.m in Sources */,
9F936B55170650EF001622D8 /* TTSlidingPageTitle.m in Sources */,
9F602A67171E083F00088A9C /* TTBlackTriangle.m in Sources */,
);
runOnlyForDeploymentPostprocessing = 0;
};
Expand Down
19 changes: 18 additions & 1 deletion UIScrollViewSlidingPages/Demo/TTViewController.m
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,24 @@ -(TTSlidingPageTitle *)titleForSlidingPagesViewController:(TTScrollSlidingPagesC
title= [[TTSlidingPageTitle alloc] initWithHeaderImage:[UIImage imageNamed:@"about-tomthorpelogo.png"]];
} else {
//all other pages just use a simple text header
title = [[TTSlidingPageTitle alloc] initWithHeaderText:[NSString stringWithFormat:@"Page %d", index+1]];
switch (index) {
case 1:
title = [[TTSlidingPageTitle alloc] initWithHeaderText:@"Page 2"];
break;
case 2:
title = [[TTSlidingPageTitle alloc] initWithHeaderText:@"Another Page"];
break;
case 3:
title = [[TTSlidingPageTitle alloc] initWithHeaderText:@"More Stuff"];
break;
case 4:
title = [[TTSlidingPageTitle alloc] initWithHeaderText:@"Another Page"];
break;
default:
title = [[TTSlidingPageTitle alloc] initWithHeaderText:[NSString stringWithFormat:@"Page %d", index+1]];
break;
}

}
return title;
}
Expand Down
13 changes: 13 additions & 0 deletions UIScrollViewSlidingPages/Source/TTBlackTriangle.h
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
//
// TTBlackTriangle.h
// UIScrollSlidingPages
//
// Created by Thomas Thorpe on 16/04/2013.
// Copyright (c) 2013 Thomas Thorpe. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface TTBlackTriangle : UIView

@end
38 changes: 38 additions & 0 deletions UIScrollViewSlidingPages/Source/TTBlackTriangle.m
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
//
// TTBlackTriangle.m
// UIScrollSlidingPages
//
// Created by Thomas Thorpe on 16/04/2013.
// Copyright (c) 2013 Thomas Thorpe. All rights reserved.
//

#import "TTBlackTriangle.h"

@implementation TTBlackTriangle

- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self setBackgroundColor:[UIColor clearColor]];
}
return self;
}

-(void)drawRect:(CGRect)rect
{
CGContextRef ctx = UIGraphicsGetCurrentContext();

CGContextClearRect(ctx, rect);

CGContextBeginPath(ctx);
CGContextMoveToPoint (ctx, CGRectGetMinX(rect), CGRectGetMinY(rect)); // top left
CGContextAddLineToPoint(ctx, CGRectGetMaxX(rect), CGRectGetMinY(rect)); // top right
CGContextAddLineToPoint(ctx, CGRectGetMidX(rect), CGRectGetMaxY(rect)); // mid bottom
CGContextClosePath(ctx);

CGContextSetRGBFillColor(ctx, 0, 0, 0, 1);
CGContextFillPath(ctx);
}

@end
43 changes: 32 additions & 11 deletions UIScrollViewSlidingPages/Source/TTScrollSlidingPagesController.m
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ this software and associated documentation files (the "Software"), to deal in
#import "TTSlidingPage.h"
#import "TTSlidingPageTitle.h"
#import <QuartzCore/QuartzCore.h>
#import "TTBlackTriangle.h"

@interface TTScrollSlidingPagesController ()

Expand Down Expand Up @@ -73,16 +74,24 @@ - (void)viewDidLoad
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(didRotate)name:UIDeviceOrientationDidChangeNotification object:nil];

int nextYPosition = 0;
int pageViewHeight = 0;
if (!self.disableUIPageControl){
//create and add the UIPageControl
int pageViewHeight = 15;
pageViewHeight = 15;
pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, nextYPosition, self.view.frame.size.width, pageViewHeight)];
pageControl.backgroundColor = [UIColor blackColor];
pageControl.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
[self.view addSubview:pageControl];
nextYPosition += pageViewHeight;
}

//add a triangle view to point to the currently selected page
int triangleWidth = 30;
int triangleHeight = 10;
TTBlackTriangle *triangle = [[TTBlackTriangle alloc] initWithFrame:CGRectMake(self.view.frame.size.width/2-(triangleWidth/2), nextYPosition/*start at the top of the nextYPosition, but dont increment the yposition, so this means the triangle sits on top of the topscroller and cuts into it a bit*/, triangleWidth, triangleHeight)];
triangle.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin | UIViewAutoresizingFlexibleRightMargin;
[self.view addSubview:triangle];

//set up the top scroller (for the nav titles to go in) - it is one frame wide, but has clipToBounds turned off to enable you to see the next and previous items in the scroller. We wrap it in an outer uiview so that the background colour can be set on that and span the entire view (because the width of the topScrollView is only one frame wide and centered).
topScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.titleScrollerItemWidth, self.titleScrollerHeight)];
topScrollView.center = CGPointMake(self.view.center.x, topScrollView.center.y); //center it horizontally
Expand Down Expand Up @@ -119,6 +128,8 @@ - (void)viewDidLoad
topScrollViewWrapper.layer.shadowOpacity = 0.3;
[self.view bringSubviewToFront:topScrollViewWrapper];//bring view to sit on top so you can see the shadow!
}

[self.view bringSubviewToFront:triangle];
}

- (void)didReceiveMemoryWarning
Expand Down Expand Up @@ -165,7 +176,16 @@ -(void)reloadPages{
label.textAlignment = NSTextAlignmentCenter;
label.adjustsFontSizeToFitWidth = YES;
label.textColor = self.titleScrollerTextColour;
label.font = [UIFont boldSystemFontOfSize:16];
label.backgroundColor = [UIColor clearColor];

//add subtle drop shadow
label.layer.shadowColor = [[UIColor blackColor] CGColor];
label.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
label.layer.shadowRadius = 2.0f;
label.layer.shadowOpacity = 1.0f;

//set view as the top item
topItem = (UIView *)label;
}
topItem.frame = CGRectMake(nextTopScrollerXPosition, 0, topScrollView.frame.size.width, topScrollView.frame.size.height);
Expand Down Expand Up @@ -202,16 +222,17 @@ -(void)reloadPages{

int initialPage = self.initialPageNumber;

//set the number of dots on the page control, and set the initial selected dot
pageControl.numberOfPages = numOfPages;
pageControl.currentPage = initialPage;


//fade in the page dots
if (pageControl.alpha != 1.0){
[UIView animateWithDuration:1.5 animations:^{
pageControl.alpha = 1.0f;
}];
if (!self.disableUIPageControl){
//set the number of dots on the page control, and set the initial selected dot
pageControl.numberOfPages = numOfPages;
pageControl.currentPage = initialPage;

//fade in the page dots
if (pageControl.alpha != 1.0){
[UIView animateWithDuration:1.5 animations:^{
pageControl.alpha = 1.0f;
}];
}
}

//scroll to the initialpage
Expand Down

0 comments on commit 51fea9f

Please sign in to comment.