An Introduction to Stack Views in iOS 9 and Xcode 7

Earlier, we’ve talked about the new features of Swift 2. Starting from this tutorial, we will cover some cool new features in iOS 9. The upcoming version of iOS comes with a lot of new features. For developers, the introduction of Stack View deserves the first mention. I know some developers find it difficult to use auto layout to design complex user interfaces. Stack views are here to help and make our developers’ job much easier.

The stack view provides a streamlined interface for laying out a collection of views in either a column or a row. For views embedded in a stack view, you no longer need to define auto layout constraints. The stack view manages the layout of its subviews and automatically applies layout constrants for you. That means, the subviews are ready to adapt to different screen sizes. Furthermore, you can embed a stack view in another stack view to build more complex user interfaces. Don’t get me wrong. It doesn’t mean you do not need to deal with auto layout. You still need to define the layout constrants for the stack view. It just saves you time from creating constraints for every UI element and makes it super easy to add/remove views from the layout.

Stack View Introduction

Xcode 7 provides two ways to use stack view. You can drag a Stack View (horizontal / vertical) from the object library, and put it right into the storyboard. You then drag and drop view objects such as labels, buttons, image views into the stack view. Alternatively, you can use the Stack option in the auto layout bar. For this approach, you simply select two or more view objects, and then click the Stack option. Interface Builder will embed the objects into a stack view and resize it automatically. If you still have no ideas about how to use a stack view, no worries. We’ll go through both approaches in this tutorial. Just read on and you’ll understand what I mean in a minute.

[Read more…]

Creating a Slide Down Menu Using View Controller Transition

Navigation is an important part of every user interface. There are multiple ways to present a menu for your users to access the app’s features. The sidebar menu that we discussed in the earlier tutorial is an example. Slide down menu is another common menu design. When a user taps the menu button, the main screen slides down to reveal the menu. If you have no idea about how a slide-down menu works, no worries. Just read on and you’ll see an animated demo.

Before showing you how to implement the menu, this tutorial assumes that you have a basic understanding of custom view controller transition. For those who are new to view controller transition, you can check out this beginner tutorial written by Joyce.

Okay, let’s get started.

slidedownmenu-0

[Read more…]

A Swift Tutorial for Stripe: Taking Credit Card Payments in iOS Apps

In this tutorial we will talk about Stripe integration. Stripe provides one of the most powerful libraries for accepting payments online and mobile apps. If you are planning to sell products in your iOS apps and searching for a payment solution, Stripe should be on the top of your list.

I get asked a lot about why iOS developers need to use Stripe rather than In-App Purchase. According to Apple, you’re required to use In-App Purchase to sell digital content such as extra game levels for your game, and bonus content for your apps. For physical goods like clothing, you’re allowed to use other payment solutions such as Stripe. So, in this tutorial, I will give you a brief introduction of Stripe, explain how it works and show you how to build a demo app using Stripe’s API for accepting credit card payments.

stripe-integration-tutorial

[Read more…]

Creating a Selectable Table App Using WatchKit

Apple announced WatchOS 2 at WWDC this year. WatchOS 2 features a lot of new frameworks that are now accessible for developers. These include programmatic access to the digital crown, new ways to play video and audio, use of the built-in microphone and the Taptic engine. On top of that, we will also be able to develop apps for the Apple Watch itself! This means we will no longer need an iPhone to run the code. The developer preview is already available and the public release will be available this fall.

We will look into the new features of WatchOS 2 in future tutorials. But today, let’s start with something basic.

In this tutorial, you’ll learn how to make a selectable table app for Apple Watch. We’re going to make a simple table of 5 countries. Each item can be selected to reveal more information about the country such as its capital.

watchkit-table-demo

[Read more…]

Building a Video Search App with YouTube API

It’s a well-known fact that Google provides a big number of electronic products and services that can be used from the simplest end-user, to the most sophisticated one. But further than those who just use the Google services as they’re provided, there are people who need to have a different kind of access to them; developers. Indeed, Google gives great assistance to developers of all kind to create multi-platform applications that use their services, as it provides various Application Protocol Interfaces (APIs) that can be used in many ways, as well as already-made libraries and SDKs for various programming languages.

As the Google APIs and services can be utilized in mobile platforms as well, apparently we could not just be left uninterested here, and as a matter of fact, we’ve already dealt with Google technologies in the past. For example, here’s a tutorial about the Google Maps SDK. Now, in this tutorial, we’re going to see for first time a totally different service, the YouTube API.

youtube-api-featured

Working with that specific API is fairly easy, but there are a few certain aspects you should already know about, otherwise your life could become a bit difficult. Let me give you some clues: First of all, we won’t use any SDK, or iOS-specific library. Instead, we’ll make simple HTTP requests (GET requests actually) to fetch data from Google. The results are in JSON format, so it’s required you already know how data is formed in JSON. You don’t have to be a JSON expert; just to understand the format. If you need assistance, here you can find some valuable information.

The Google documentation regarding the YouTube API is really big, so my intention here is to gather information from various pages into one place and help you get started with this API fast and easily. Even though we are about to cover just a small portion of the YouTube API, what you will learn will show you the way for the rest of it. However, I have to mandatorily mention a few facts before we continue.

[Read more…]

How to Use iOS Charts API to Create Beautiful Charts in Swift

Using charts to display data can help users understand the information more easily than they would if it were presented in a table, especially when dealing with a lot of data. With charts, you can easily see patterns in the data at a glance as opposed to reading through a whole table (or several tables) to get this information. The use of charts has been a common feature in business and fitness apps.

In this article, we’ll look at how to add charts to your application using the ios-charts library by Daniel Cohen Gindi. ios-charts is an iOS port of the fairly popular Android library MPAndroidChart created by Philipp Jahoda. With this library, you can include various types of charts in your app fairly quickly and easily. With a few lines of code, you can have a fully working and interactive chart, that is highly customizable.

ios-charts-api

Core features of the library include:

  • 8 different chart types
  • Scaling on both axes (with touch-gesture, axes separately or pinch-zoom)
  • Dragging / Panning (with touch-gesture)
  • Combined-Charts (line-, bar-, scatter-, candle-stick-, bubble-)
  • Dual (separate) Y-Axis
  • Finger drawing (draw values into the chart with touch-gesture)
  • Highlighting values (with customizeable popup-views)
  • Multiple / Separate Axes
  • Save chart to camera-roll / export to PNG/JPEG
  • Predefined color templates
  • Legends (generated automatically, customizable)
  • Customizable Axes (both x- and y-axis)
  • Animations (build up animations, on both x- and y-axis)
  • Limit lines (providing additional information, maximums, e.t.c.)
  • Fully customizable (paints, typefaces, legends, colors, background, gestures, dashed lines, e.t.c.)

[Read more…]

A Beginner’s Guide to UIScrollView

In iOS, scroll views are used to view content that won’t fit entirely on the screen. Scroll views have two main purposes:

  • To let users drag the area of the content they want to display
  • To let users zoom in to or out of the displayed content using the pinch gestures

A common control used in iOS apps – UITableView – is a subclass of UIScrollView and provides a great way to view content that is larger than the screen.

In this tutorial, we’ll look at various aspects of UIScrollView, specifically, creating a scroll view programmatically and in Interface Builder, scrolling and zooming, working with insets and nested scroll views.

UIScrollView Guide

Before reading on, first download the resource file for the project which contains files we’ll use in the tutorial.

[Read more…]

What’s New in Swift 2.0: A Brief Introduction

Editor’s note: This post is contributed by Maxime. He was recently awarded the WWDC scholarship to attend this year’s conference. We’re so happy to have him to share with us about the new features of Swift 2.

Update: We’ve published a beginner’s guide to Swift 2.

One year ago, Apple brought us Swift, a brand new programming language for both iOS and OS X. When it was first announced, just like other iOS developers, I was thrilled. Advertised as a fast and safe language, Swift has now grown to one of the most popular programming languages. As expected, the company introduced Swift 2 at WWDC this year. I am fortunate that I got an opportunity to attend the conference so I can share some updates on Swift.

We’re stepping on the gas this year with Swift 2. We think Swift is the next big programming language, the one we will all do application and systems programming on for 20 years to come. We think it should be everywhere and used by everyone.

Craig Federighi, Apple’s senior vice president of Software Engineering

What's new in Swift 2

We measure temperature in Celsius or Fahrenheit scale. At WWDC, we measure the popularity of a new feature in decibel. The two biggest applauses this year were when Apple announced UI testing support in Xcode 7 and Swift goes Open Source. If you missed the WWDC keynote or have been living under a rock lately, you read it right: Swift goes open source. This is a huge deal. Later this year, Apple will release Swift’s source code to the public, including the compiler and standard libraries, under an OSI-compliant license. Apple will also port the source code to Linux. Developers will be able to contribute to the development of the language and write programs on Linux using Swift. In fact, you’re encouraged to contribute to the development of the language.

Along with this exciting news, Swift 2 includes some new features such as improved error handling, protocol extensions and availability check. Let me give you a brief overview of the updates.

[Read more…]

Building a Custom Pull To Refresh Control for Your iOS Apps

In a world that there are extremely so many mobile applications, there is no doubt that it’s tremendously difficult to create new ones that will attract users’ attention and will make their way among all others up to the top successfully. Definitely, one could say that a secret ingredient that turns simple apps to outstanding apps is the customization touches that development teams (developers and designers) apply to small details that usually most programmers don’t deal with. One of them, as you assume from the tutorial’s title, is the pull-to-refresh control, and through this post I am about to show you the way to override its default appearance.

As you know, the pull-to-refresh control is the activity view indicator (often along with some short message) that appears on top of a tableview when data loading is in progress, and the tableview’s contents have not been refreshed yet. Actually, the pull-to-refresh control is something like a “Please, wait…” message shown to the users while they’re awaiting for new content to be fetched and displayed. The most well-known app that uses it is the Mail, where by dragging towards bottom the emails tableview leads to refreshing them. The debut of that control was made in iOS 6, and since then it has been used thousand times in countless applications.

pull-to-refresh-featured

If you have ever desired to use the pull-to-refresh control in any of your apps and you’ve searched around for information on how to do that, then you’ve definitely come across to the Simon’s tutorial that perfectly explains all you need to know. In this post we are going to see another aspect of the pull-to-refresh though; how to create a custom one, so you can apply a different style to this small but important detail that will attach a different perspective to your apps.

So, finishing this quick prelude, in the next few parts you are going to see a technique that enables you to add any custom content and animation you want so you can “replace” the default pull-to-refresh control. Note that what you will see next is just to demonstrate the logic you should follow; the actual custom content it totally up to you, or more precisely, is up to your imagination. Let’s get started, and in a pretty short amount of time you’ll be able to create custom pull-to-refresh content!

[Read more…]

A Beginner’s Guide to Presentation Controllers in iOS 8

Before the introduction of iOS 8 and specifically, Adaptive UI, whenever you wanted to display presentation sheets in a universal app, you had to make platform checks to verify whether the device the app was running on was an iPhone or an iPad to decide whether to present the sheet as a popover or to push a view onto the screen.

iOS 8 introduces presentation controllers which make the above unnecessary. Now you can write a single code path for your presentation, that works on all devices, adapting itself to the device size and orientation. You do this by specifying a preferred presentation style when presenting a view controller, for example a popover, and then according to the size class of your device, the OS will either present the view controller in that style or switch to an alternative style, for example a popover being presented as full screen on compact-width sizes.

ipad-presentation-controller

In this article we’ll start off by looking at UIAlertController which replaces UIAlertView and UIActionSheet to present information to the user. We’ll then look at UIPopoverPresentationController which enables us to create adaptive presentation controllers without writing platform specific code. We’ll finish off by looking at how you can create your own custom presentation controllers. We have covered UIAlertController here on Appcoda before, so feel free to skip that part if you wish to.

[Read more…]