GScanBarCode Apps – iPhone / iPad Apps

GScanBarCode (English)
This is an simple BarCode + Email app published under my client’s name. This app is to make purchasing easier and faster for people who are interested in Grand General Accessories products. The users will be able to submit their requests directly to Grand General via their iPhones/iPad and receive a response from the company quickly. This is not only an app but also a simple and efficient communication tool for the users and Grand General. The features contains Grand General’s barcode verifying and scanning, application form, login access control and email the content in a format for in-house system, etc.

Love Daily Apps – iPhone / iPad Apps

Love Daily I : Beginning (English)
This is Part One of a Daily Devotion on The Great Commandment, based on the book love every day. Tim Keller has said that our sinfulness is far worse than we ever could imagine, and that God’s love is far more than we ever dared hope. And Christians for millennia have affirmed no better way to learn these truths — and many others besides — than to love God with all our heart and soul and mind and strength. This App helps you do just that. By love we discover the depths and the heights at the same time. And a course there’s that loving God part, as well. Which is pretty good all by itself.

Affirmation Apps – iPhone and Android App – Abundance – Creating Money: Keys to Abundance

Affirmation – Abundance Creating Money: Keys to Abundance
Abundance (English for iPhone)
This is a collection of inspirational affirmation to help you be prosperous…

Affirmation – Abundance Creating Money: Keys to Abundance
Abundance (English for Android)
This is a collection of inspirational affirmation to help you be prosperous…

Meditation Apps

Guided Meditation – Develop Your Inner Senses – Relax
iPad App . Language: English . This is an easy-to-follow guided meditation to relax your mind and body. The narrator has a soft, calming voice that gently takes you through each meditation, stage-by-stage, and makes the whole process fairly simple.

A.Relax . iPad App . Language: Chinese . 冥想,發現充滿各種可能性的內在世界。由陳嘉珍老師導引的,啓動內在感官的冥想練習 – 放鬆。

M.Relax . iPhone App . Language: Chinese . 冥想,發現充滿各種可能性的內在世界。由陳嘉珍老師導引的,啓動內在感官的冥想練習 – 放鬆。

M.Light . iPhone App . Language: Chinese . 冥想,發現充滿各種可能性的內在世界。由陳嘉珍老師導引的,啓動內在感官的冥想練習 – 光。(適合短時間十分鐘的冥想練習。)

Chanting Machine Apps

MedBuddha
iPhone App . Language: English . Medicine Buddha Mantra – mantra chanting machine to help meditation with timer

藥師佛心咒
iPhone App . Language: Chinese . 藥師佛心咒念佛機 – 常誦念此咒, 能讓身心清淨光明, 吉祥如意

New Age Speeches Apps

Dr Hsu Weekly Speeches . iPhone App . Language: Chinese . 許醫師星期講座: 這是一系列許添盛醫師的公益身心靈講座, 活用賽斯心法, 來面對生活上的許多事件或是身體的疾病, 有助於提升我們的生活品質.

Others

內在能量冥想 . iPhone App . Language: Chinese

InnerEnergyLite . iPhone App . Language: Chinese

Name

Email

Comments

Please enter the security code

?

Please enter the security code.

Below is the guide on how to add iAd banner into iPhone app. Guide is based on iAd Programming Guide and WWDC 2010 video.

My real App with the iAd Banner

Click here to download the Free App from iTunes Store

Add iAd Banner to iPhone App

The first thing you need to do is to add iAd.framework in your Xcode project which is contained in iOS 4 SDK. Also do not forget to add #import . Developers can choose between two banners: 320×50 px for portrait and 480×32 px for landscape. The base of banner is ADBannerView, which is subclass of UIView. So the only thing you have to do is to add this view in your control elements hierarchy (you can do this programmatically or using Interface Builder).

Apple recommends to put banner at the bottom or at the top of the window and do not place it on any moving elements like ScrollView or TableView as far as that will decrease shows of banner (and your revenue respectively) and will make it more difficult for user to tap on the ads.

Let’s create a new project in Xcode using View-based Application template and add a banner into it. Name of the app – iAdEx. We are going to edit iAdExViewController.h

#import <UIKit/UIKit.h>;
#import <iAd/iAd.h>;
 
@interface iAdExViewController : UIViewController <ADBannerViewDelegate>
{
      ADBannerView *adView;
      BOOL bannerIsVisible;
}
@property (nonatomic,assign) BOOL bannerIsVisible;
@end

and modify viewDidLoad method in iAdExViewController.m

- (void)viewDidLoad {
      adView = [[ADBannerView alloc] initWithFrame:CGRectZero];
      adView.frame = CGRectOffset(adView.frame, 0, -50);
      adView.requiredContentSizeIdentifiers = [NSSet setWithObject:ADBannerContentSizeIdentifierPortrait];
      adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
      [self.view addSubview:adView];
      adView.delegate=self;
      self.bannerIsVisible=NO;
      [super viewDidLoad];
}

Let’s talk about requiredContentSizeIdentifiers and currentContentSizeIdentifier properties. In the first one you define all types of banners you are going to use. And the second property defines which type of banner you are going to use at the present moment.

Connection issues

Banners are downloaded from the network. What if we have no network connection right now? Or Apple has any issues with ads server? Our ADBannerView will be empty is these cases. It doesn’t look very nice and wastes space on the screen. Apple recommends to do it in this way: when there is no banner for any reason remove it from the screen; when banner is received – show it again.

We have the ADBannerViewDelegate in our class and it can receive messages from banner – bannerViewDidLoadAd (when banner is loaded successfully) and didFailToReceiveAdWithError (when any problems occured). Let’s implement these messages:

- (void)bannerViewDidLoadAd:(ADBannerView *)banner
{
 if (!self.bannerIsVisible)
 {
  [UIView beginAnimations:@"animateAdBannerOn" context:NULL];
// banner is invisible now and moved out of the screen on 50 px
  banner.frame = CGRectOffset(banner.frame, 0, 50);
  [UIView commitAnimations];
  self.bannerIsVisible = YES;
 }
}
 
- (void)bannerView:(ADBannerView *)banner didFailToReceiveAdWithError:(NSError *)error
{
if (self.bannerIsVisible)
 {
  [UIView beginAnimations:@"animateAdBannerOff" context:NULL];
// banner is visible and we move it out of the screen, due to connection issue
  banner.frame = CGRectOffset(banner.frame, 0, -50);
  [UIView commitAnimations];
  self.bannerIsVisible = NO;
 }
}

It’s time to launch the app and see what we have now:

Tap the banner

And that’s it – we’ve done it in accordance with Apple’s recommendations. When we launch the app we see the banner. If we tap it, then full view of advertisement is shown. But we still have one issue…

In real app we should stop any application’s activity such as video, audio playback or pause game. In order to solve this task we will create two methods bannerViewActionShouldBegin (when full screen ad is shown) and bannerViewActionDidFinish (when we close ads).

- (BOOL)bannerViewActionShouldBegin:(ADBannerView *)banner willLeaveApplication:(BOOL)willLeave
{
 NSLog(@"Banner view is beginning an ad action");
 BOOL shouldExecuteAction = YES;
 if (!willLeave && shouldExecuteAction)
    {
    // stop all interactive processes in the app
    // [video pause];
    // [audio pause];
    }
 return shouldExecuteAction;
}
 
- (void)bannerViewActionDidFinish:(ADBannerView *)banner
{
   // resume everything you've stopped
   // [video resume];
   // [audio resume];
}

Change Orientation of iAd

What else should we do? We need to make banner change it’s orientation in accordance with iPhone position. First of all we need to change the line where we define types of banners which we will use:

- (void)viewDidLoad {
...
adView.requiredContentSizeIdentifiers = [NSSet setWithObjects:ADBannerContentSizeIdentifierPortrait,ADBannerContentSizeIdentifierLandscape,nil];
if (UIInterfaceOrientationIsLandscape(self.interfaceOrientation)) {
        adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierLandscape;
    }else
    {
        adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
    }
...
}

and here are methods for changing orientation:

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
 // Return YES for supported orientations
 return (interfaceOrientation!= UIInterfaceOrientationPortraitUpsideDown);
}
 
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
 if (UIInterfaceOrientationIsLandscape(toInterfaceOrientation))
  adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierLandscape;
 else
  adView.currentContentSizeIdentifier = ADBannerContentSizeIdentifierPortrait;
}

And here is how it look in a landscape

When device changes orientation we change currentContentSizeIdentifier property of ADBannerView. Now we can see banners in landscape mode too. There is still 50 px offset, but it’s easy to fix.

Apple developers also recommend to write object.delegate=nil; line before deallocating ADBannerView object. In our example it will look like:

- (void)dealloc {
 adView.delegate=nil;
 [adView release];
 [super dealloc];
}

Now we have finished with programming part.
(Appreciate the source tutorial article from: http://bees4honey.com/blog/tutorial/how-to-add-iad-banner-in-iphoneipad-app/)

HTML5 – Edition for Web Authors

HTML5 – A vocabulary and associated APIs for HTML and XHTML

HTML5 Outliner – gsnedders.html5.org/outliner/

HTML5 Outliner – h5o (bookmarklet, Chrome extension)

Your Ultimate Guide to the Rel Attribute in HTML5

For more reference, please check out the course name: HTML5: Structure, Syntax, and Semantics from the link of Lynda.com below.

HTML5: Structure, Syntax, and Semantics gives designers a deeper understanding of HTML5 and shows how to create richer, more meaningful web pages with structural tags and descriptive attributes. Author James Williamson presents an overview of HTML5 and its development, defines the new tags and attributes, and discusses how browsers parse and display HTML5 content. The course also includes step-by-step instructions for constructing an HTML5 document with a header and footer, navigation, content groups, and formatting. Exercise files are included with the course.
Topics include:

Defining basic elements
Exploring the content model
Creating document sections
Using hgroup to override sectioning
Using the proper nesting structure
Choosing the right structural element
Using class and ID attributes
Building navigation
Grouping content with asides
Using divs in HTML5
Creating block level links
Defining link relationships
Understanding current browser support
Adding support for elements in older browsers

Following is a list of known implementations of HTML5 and related features in web browsers.
Implementations in Web browsers

Comparison of layout engines (HTML5)

browser support revealed

Windows Internet Explorer Testing Center

When can I use…
Compatibility tables for support of HTML5, CSS3, SVG and more in desktop and mobile browsers.

html5test.com
How well does your browser support HTML5?

HTML5 accessibility

Modernizr is a small JavaScript library that detects the availability of native implementations for next-generation web technologies, i.e. features that stem from the HTML5 and CSS3 specifications. Many of these features are already implemented in at least one major browser (most of them in two or more), and what Modernizr does is, very simply, tell you whether the current browser has this feature natively implemented or not.

Tutorials and Articles
dev.opera.com

Internet Explorer Learning – HTML5

The WHATWG Blog

html5 doctor

Here we use one of the most popular CMS, WordPress, to organize article categories and articles in a hierarchy. Make it possible for article categories to have subcategories and for articles to have sub-articles and to be shown in navigation menus, category pages and home page.

Before re-design:

After re-design:

On the right, it’s the screenshot of the old website. All the contents are static html web pages. There is no interactive functionalities for visitors on the site. It’s not easy to update or create any new post by a regular user.

Below are the screenshots of the redesign built by WordPress, one of the popular website CMS (content management system) platform. This platform support and implement many features to display photos, blogging posts, searching box, Facebook posts, Tweeter feeds and RSS.

• Get Instant access to thousands of products listed in different categories/sub-categories.
• View product images & description along with other details.
• Enabling buyers to find the right product by search

Site design with a WordPress CMS to turn a static business catalogue or brochure into an online showroom.

You may think about to create an online shopping cart or an online catalogue to display your products and features. And you want to update the product detail, the specifications, or the product pictures by yourself in the future. To create and develop a CMS based website is the best choice. We help you on the development and walk you through and train you to maintain the web pages.

More over, this CMS based website is optimized with search engines. The url names, title tag, html coding are optimized with keywords. As you should know, search engine optimization is everything to be keyword relevant.

Since this is an online catalogue website, to organized all the 50 products for the web site, we categorized them into beauty and health industry. There are Adult Care, Body Care, Breast Care, Eye Care, Hair Care, Nail Care, Skin Care and Diet Easy Weight Loss. Each product page links to 4 other items at the bottom listed as “you may also be interested in this/these product(s):” (as the screenshot on the right).

All the products are listed as an online catalogue, and could be released to cooperate with on-line shopping cart. This rozge website is designed and published by end of September 2007.

Why use web content management systems (CMS)?

A web content management system is content management system (CMS) software implemented as a web application used for creating and managing HTML content. It is used to manage and control a large, dynamic collection of web material (HTML documents and their associated images).

A Content Management System (CMS) differs from website builders like Microsoft FrontPage or Macromedia Dreamweaver. A CMS allows non-technical users to make changes to an existing website with little or no training. Web CMS typically require an experienced coder to set-up and add features, but it is primarily a website maintenance tool for non-technical administrators.

If you’ve read anything at all about Content Management Systems (CMS), you’ll probably know at least three things: CMS are the most exciting way to do business, CMS can be really, complicated and lastly Portals are absolutely, outrageously, often unaffordably expensive.

However, Joomla and WordPress set to change all that…Joomla and WordPress are different from the normal models for portal software. For a start, it’s not complicated. Joomla and WordPress have been developed for the masses. If you required a Joomla or a WordPress CMS developer for your project work, contact us!