IOS development-Passbook details and development cases (with video)

Source: Internet
Author: User

Passbook is a new feature of iOS 6 and can only be used on iPhone and iPod touch devices. It helps us manage e-membership cards, credit card points, and coupons issued by sellers. This will have a profound impact on the future of e-commerce. Sellers can improve interaction with consumers by issuing membership cards, credit card points, and coupons to attract more consumers. The birth of Passbook is precisely to save all these cards and coupons electronically in the iPhone or iPod touch.


Passbook and Pass

The Passbook in iOS 6 helps us to centrally manage electronic "cards" and "coupons". These electronic "cards" and "coupons" are "Pass" and "Passbook" Are these "Pass collection management applications. The relationship between Passbook and Pass. Passbook is our "card package", while Pass is the "card" and "coupon" in it ".

650) this. length = 650; "class =" aligncenter size-full wp-image-179 "alt =" 1 "src =" http://www.bkjia.com/uploads/allimg/131228/0649223456-0.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649223456-0.png "height =" 407 "width =" 414 "/>

When we select one of the cards, the cards will slide out and click the "I" button in the lower right corner to flip to the back. You can click the recycle bin button in the upper left corner to delete it. A confirmation box with a metallic paper shredder style is displayed. When you click the delete button, the Shredder will smash the card, there are also animation effects. I was amazed every time I used this function, and Apple was impeccable in designing the details.

650) this. length = 650; "class =" aligncenter size-full wp-image-180 "alt =" 2 "src =" http://www.bkjia.com/uploads/allimg/131228/06492220a-2.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/06492220a-2.png "height =" 307 "width =" 440 "/>

5 Pass styles

IOS 6 currently provides five types of Pass, which are:

Boarding passes Boarding pass ). Although literally translated as "boarding Pass", it includes boarding Pass, train ticket, boarding Pass, and other types of tickets. There are information such as the starting and ending points, time and boarding Pass on the Pass.

Coupons coupon ). Or a discount card is used to describe the electronic creden。 of the product's discount or discount information. Generally, there will be a seller's logo, discount ratio, term of use, and other information.

Store cards shopping cards ). This section describes the electronic credential of your account balance in a mall or club. Generally, there will be user-level information.

Event tickets ). Describes electronic creden for admission tickets such as sports competitions, concerts, and concerts. Generally, there will be a large background image. The image is blurred and can be scaled down clearly.

Generic universal card ). If the above four types cannot meet the requirements, we can use this type, which can be used to customize the above content. A general card membership card.

650) this. length = 650; "class =" aligncenter size-full wp-image-181 "alt =" 3 "src =" http://www.bkjia.com/uploads/allimg/131228/06492253Q-4.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/06492253Q-4.png "height =" 485 "width =" 551 "/>

Internal Structure of Pass

Each Pass is a compressed file in ZIP format. The file suffix is pkpass, which is used by users in some special ways. We will introduce these special methods later. If we open the pkpass file using the decompression software, we will see the following content:

Pass

── Icon.png

── Icon@2x.png

── Logo.png

── Logo@2x.png

── Thumbnail.png

── Thumbnail@2x.png

── Background.png

── Background@2x.png

── Strip.png

── Strip@2x.png

── Manifest. json

├ ── Fr. lproj

│ └ ── Pass. strings

── De. lproj

│ └ ── Pass. strings

── Pass. json

── Signature

The pass. json file is the core of the Pass. It describes all the information on the front and back of the Pass. We provide all the images to be displayed for this Pass. Finally, a configuration file manifest is required. json, which contains the SHA1 checksum of all these files and a separate signature file signature, so that Passbook can verify that this Pass has not been modified after it is created.

Pass Kit programming: Example: MyPass instance design and description

Next we will introduce the programming process of the Pass Kit through an instance MyPass. A prototype sketch of the MyPass instance is provided. When MyPass is started, the home page is a table view screen. It queries some specific passes in the Passbook on the local device and then displays the table view screen. Click the "+" button. If the boarding Pass exists, replace it. Otherwise, add the boarding Pass to Passbook. the boarding Pass is requested to be downloaded from the iosbook3.com server. If you click a cell in the table view, the screen will jump to the Pass Details screen. In the Details screen, you can click the "Remove" button in the upper-right corner of the navigation bar to delete the current Pass from Passbook.

650) this. length = 650; "class =" aligncenter size-full wp-image-182 "alt =" 4 "src =" http://www.bkjia.com/uploads/allimg/131228/0649223R9-6.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649223R9-6.png "height =" 324 "width =" 405 "/>

Start Passbook

650) this. length = 650; "class =" aligncenter size-full wp-image-183 "alt =" 5 "src =" http://www.bkjia.com/uploads/allimg/131228/064922H34-8.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/064922H34-8.png "height =" 454 "width =" 150 "/>

1. Create an App ID

To create an App ID for any iOS App, enter "Pass Kit Dev" in the Description project and select "Use Team ID" in the Bundle Seed ID (App ID Prefix) project ". In the Bundle Identifier (App ID Suffix) project, enter "com.51work6. MyPass ".

After successful creation, the App ID page is displayed. In the App ID list, you will find the Pass Kit Dev

650) this. length = 650; "class =" aligncenter size-full wp-image-184 "alt =" 6 "src =" http://www.bkjia.com/uploads/allimg/131228/06492260Y-10.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/06492260Y-10.png "height =" 110 "width =" 486 "/>

2. Configure Pass availability

By default, the created application cannot access Passbook. You need to click the Configure hyperlink to go to the application configuration page and select Enable for Passes to Enable Pass.

650) this. length = 650; "class =" aligncenter size-full wp-image-185 "alt =" 7 "src =" http://www.bkjia.com/uploads/allimg/131228/0649224Z5-12.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649224Z5-12.png "height =" 340 "width =" 445 "/>

Click the "Done" button in the lower right corner of the configuration to save the configuration and return to the App ID list page. At this time, let's take a look at the application We Just configured, its Pass status changes to green available.

3. Create a configuration Profile

To be able to write applications on devices, we also need to create a configuration profile. After the configuration is created, download the configuration summary file to your local device.

650) this. length = 650; "class =" aligncenter size-full wp-image-186 "alt =" 8 "src =" http://www.bkjia.com/uploads/allimg/131228/0649222338-14.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649222338-14.png "height =" 160 "width =" 455 "/>

4. Create a Pass type ID

Creating a Pass type ID is also an important step. We need to set the Pass type ID to "pass.com. 51work6. boarding-pass ".

5. Configure the Xcode project code signature

After completing the preceding work, we need to create and configure the Xcode project, create the project name "MyPass" application, and then configure the Xcode project code signature. This signature requires 3rd steps to create a configuration profile.

Select TAGETS → MyPass → Code Signing Identity, and then select Pass Kit Dev Profile.

650) this. length = 650; "class =" aligncenter size-full wp-image-187 "alt =" 9 "src =" http://www.bkjia.com/uploads/allimg/131228/0649221094-16.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649221094-16.png "height =" 130 "width =" 449 "/>

After setting, you can start encoding.

6. Configure Xcode project configuration authorization information

The configuration authorization information is similar to that of the iCloud application. Select TAGETS → MyPass → Summary → Entitlements. Here we can configure the authorization information.

650) this. length = 650; "class =" aligncenter size-full wp-image-188 "alt =" 10 "src =" http://www.bkjia.com/uploads/allimg/131228/0649225344-18.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649225344-18.png "height =" 309 "width =" 452 "/>

The authorization information items are described as follows:

Entitlements: Check Use Entitlements File to specify an authorization File. This File is not created by yourself in your project directory. It records the detailed authorization configuration information below;

Pass: select the Pass type identifier. First select Use selected pass type identifier, and then select pass.com. 51work6. boarding-pass;

So far, the preliminary preparation process of programming has been completed. Next we will introduce the programming process of the instance.

Access Passbook

The Pass operation is completed through the PKPassLibrary class. The PKPassLibrary class is not designed as a singleton. Use the following code to obtain the instance object:

PKPassLibrary * passLib = [[PKPassLibrary alloc] init];

Methods related to accessing Passbook in the PKPassLibrary class include:

Passes obtains the Pass specified by all authorization files in Passbook. The Pass type ID specified in the authorization file is pass.com. 51work6. boarding-pass, so this method obtains the Pass type ID as pass.com. 51work6. all boarding-pass Pass.

PassWithPassTypeIdentifier: serialNumber: gets the Pass object through the specified Pass type ID and serial number.

Next let's look at the relevant program code. The ViewController. h code is as follows:

#import <UIKit/UIKit.h>#import ”ASIHTTPRequest.h”#import ”PassKit/PassKit.h”#import ”DetailViewController.h”#define SerialNumber @”gT6zrHkaW”@interface ViewController :UITableViewController <PKAddPassesViewControllerDelegate>@property (strong, nonatomic) NSArray* passes;- (IBAction)add:(id)sender;@end

The ViewController. m code is as follows:

-(Void) viewDidLoad {[super viewDidLoad]; // determine whether Passbook is available if (! [PKPassLibrary isPassLibraryAvailable]) {NSLog (@ "Passbook unavailable .");} Else {[[nsicationcenter center defacenter center] addObserver: selfselector: @ selector (handler :) name: jsonobject: nil] ;}}-(void) viewWillAppear :( BOOL) animated {[super viewWillAppear: YES]; // refresh the screen [self handleLibraryChange: nil];} # pragma mark-notification for handling Passbook changes-(void) handleLibraryChange :( NSNotification *) not ④ {PKPassLibrary * passLib = [[PKPassLibrary alloc] init]; // sort NSSortDescriptor * byName = [NSSortDescriptorsortDescriptorWithKey: @ "localizedName" ascending: YES]; _ passes = [[passLib passes] sortedArrayUsingDescriptors: @ [byName]; [self. tableView reloadData];}-(void) didReceiveMemoryWarning {[super didreceivemorywarning]; [[nsicationicationcenter defacenter center] removeAllObjects];}

Release Pass

After the Pass signature and compression are successful, how can I publish the pkpass file to users? For pkpass files provided to common users, there are three release methods: Email release, Web site release, and in-app release.

Email Publishing

This release method is to send the pkpass file as an Email attachment to the user. It is recommended that the user open the Email address on his iPhone or iPod touch device to read the Email. The passage in the emailattachment. The graph in the attachment is the logo.png file in the passage.

650) this. length = 650; "class =" aligncenter size-full wp-image-189 "alt =" 11 "src =" http://www.bkjia.com/uploads/allimg/131228/064922A09-20.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/064922A09-20.png "height =" 303 "width =" 201 "/>

When you click the attachment "Store Card", the page will jump to and click "Add" on the right of the navigation bar to Add the Pass to Passbook.

650) this. length = 650; "class =" aligncenter size-full wp-image-190 "alt =" 12 "src =" http://www.bkjia.com/uploads/allimg/131228/0649221105-22.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649221105-22.png "height =" 303 "width =" 202 "/>

If you do not receive an Email on your iPhone or iPod touch, you can use the Email application to receive the Email on Mac OS X 10.8.2 or later.

650) this. length = 650; "class =" aligncenter size-full wp-image-191 "alt =" 13 "src =" http://www.bkjia.com/uploads/allimg/131228/0649222c9-24.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649222c9-24.png "height =" 274 "width =" 378 "/>

Click "view creden……" in the email ..." Button to pop up the Add Pass dialog box.

650) this. length = 650; "class =" aligncenter size-full wp-image-192 "alt =" 14 "src =" http://www.bkjia.com/uploads/allimg/131228/0649222D6-26.png "_ xhe_src =" http://www.bkjia.com/uploads/allimg/131228/0649222D6-26.png "height =" 296 "width =" 284 "/>

If this Pass is not added to Passbook, the button in the lower-right corner is "add to Passbook". If it has been added to Passbook, the button is "completed" or "updated ".

Passbook is here! For more information about Passbook, refer to my new book "iOS network programming and cloud application best practices" and the "Apple e-commerce discussion-iOS6 Passbook Analysis and Development" open classes for dobe free in November May 30.


This article from the "Guan Dongsheng" blog, please be sure to keep this source http://2009315319.blog.51cto.com/701759/1212477

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.