iOS Development-Blog Export Tool development tutorial (with source code)

Objective:

As a student, as an iOS development learner, my personal browsing information includes blogs and more mobile terminals. However, CSDN does not have a ready-made client (though there is a web version).

I've seen an open source export tool before, but it's based on the Windows platform. The export is also only in PDF format. Also, for the export of articles, exact URLs are required. Do not export while browsing.

In addition, what I want to achieve is that you can browse your favorite articles without a network. And, for their own collection of articles, can be classified management.

Most crucially, for your own article, you can make a backup. I have encountered such a thing, csdn account password leakage, so that others log in my account to post spam blog, resulting in my blog was sealed one day. At that time, my blog recorded 170 of their own learning bits, no backup, you can imagine how I panicked. Visible, the importance of backing up your own articles.

For all these reasons, the iOS platform-based blog export tool has emerged.

Note:

This article is participating in the 2014 CSDN blog competition. If you feel that it is helpful to you, hope to be able to cast a valuable vote.

Vote Link: http://vote.blog.csdn.net/Article/Details?articleid=31768677

Specific features:

• Support Online Browsing CSDN blog
• Available types include: Single article, column, designated author all articles
• The methods of export include: (1) Browse blog post/Expert/column (2) export the specified URL post/expert/column
• Export Article Classification Management
• Export article query function
• Export article Auto-typesetting, image adaptation, can be shrunk

Operating effect:

See here, if you just want to experience this app and want to see the source code, that can be downloaded from my github. In addition, the first version has been uploaded to the App Store. Waiting for approval.

Https://github.com/colin1994/csdnBlog.git

If you want to understand the overall development process, please continue to look down. recommended to download the source code, against the look .

You will learn to:

• customizing startup animations
• Network environment judgment (whether it is Wi-Fi status)
• The interaction of iOS with JavaScript
• Custom HUD Load effect (non-traditional chrysanthemum)
• UITableView List Basic Operations
• List keyword fuzzy query
• Picture Basic operation

The following analysis is carried out individually.
(a) Custom launch animations are different with the traditional modified launchimage to load a static picture as our welcome interface, here I simply realized the image zoom, text gradually show the effect. Relatively, more beautiful, we can do more than the operation.
Open the AppDelegate.h file and declare a variable to display our view.

@property (Strong, nonatomic) Uiimageview *splashview;

Open the APPDELEGATE.M file and join the specific implementation process. 1. Add Start animation

    Add start animation    [Self.window makekeyandvisible];    Splashview = [[Uiimageview alloc]initwithframe:cgrectmake (0, 0, +, screen_height)];        if ([[UIScreen mainscreen] Bounds].size.height = = 568)    {        [Splashview setimage:[uiimage imagenamed:@] bgBlog-568 "];    }    else    {        [Splashview setimage:[uiimage imagenamed:@ "Bgblog"];    }        [Self.window Addsubview:splashview];    [Self.window Bringsubviewtofront:splashview];        [Self Performselector: @selector (scale) Withobject:nil afterdelay:0.0f];    [Self performselector: @selector (Showword) Withobject:nil afterdelay:2.5f];

2. Animation specific implementation

-(void) scale{Uiimageview *logo_ = [[Uiimageview alloc]initwithframe:cgrectmake (119, 88, 82, 82)];    Logo_.image = [UIImage imagenamed:@ "Csdnlogo"];    [Splashview Addsubview:logo_]; [Self setanimation:logo_];} -(void) Setanimation: (Uiimageview *) nowview{[UIView animatewithduration:1.0f delay:0.0f Options:uiviewanimationopti Oncurvelinear animations:^ {//Executed animation code [Nowview Setframe:cgrectmake (Nowview.fra me.origin.x-nowview.frame.size.width*0.1, nowview.frame.origin.y-nowview.frame.size.height*0.1,     nowview.frame.size.width*1.2, nowview.frame.size.height*1.2)];     } completion:^ (BOOL finished) {//execute code [Nowview Removefromsuperview] after completion;    }     ]; }-(void) showword{Uiimageview *word_ = [[Uiimageview alloc]initwithframe:cgrectmake (170, 29)    ];    Word_.image = [UIImage imagenamed:@ "Word_"];        [Splashview Addsubview:word_];    Word_.alpha = 0.0; [UIView animatewithduration:1.0f delay:0.0f options:uiviewanimationoptioncurvelinear animations:^ {     Word_.alpha = 1.0;          } completion:^ (BOOL finished) {//execute code [nsthread sleepfortimeinterval:1.0f] after completion;     [Splashview Removefromsuperview]; }     ];}

(b) Network environment judgment (whether it is Wi-Fi status) This requires importing the Reachability.h/. m file under the Wi-Fi folder. This is the official download from Apple. A file used to determine the network environment. The reason we want to determine whether in a Wi-Fi environment is because export articles may use a large amount of traffic, we need to prompt users to turn on Wi-Fi to download.
1. Import Reachability.h/. m files 2. Add a header file

#import "Reachability.h"            //wi-fi

3. Judging the network environment

    if ([reachability reachabilityforinternetconnection].currentreachabilitystatus = = Reachableviawifi)    {        // Add the things you want to do    }

Three The interaction between iOS and JavaScript UIWebView is one of the most commonly used SDKs for iOS, and it has a stringbyevaluatingjavascriptfromstringmethod allows you to embed JavaScript in a page, which allows us to interact with page elements in UIWebView in iOS.
Several common ways to use: 1. Gets the URL of the current page.

-(void) Webviewdidfinishload: (UIWebView *) WebView {    NSString *currenturl = [WebView stringbyevaluatingjavascriptfromstring:@ "Document.location.href"];}

2, get the page title.

-(void) Webviewdidfinishload: (UIWebView *) WebView {     NSString *currenturl = [WebView stringbyevaluatingjavascriptfromstring:@ "Document.location.href"];   NSString *title = [WebView stringbyevaluatingjavascriptfromstring:@ "Document.title"]; }

3. Modify the value of the interface element.

NSString *js_result = [WebView stringbyevaluatingjavascriptfromstring:@ "Document.getelementsbyname (' Q ') [0].value= '] Colin '; "];

4. Form submission:

NSString *JS_RESULT2 = [WebView stringbyevaluatingjavascriptfromstring:@ "Document.forms[0].submit (); "];

Of course, there are more features that you need to learn on your own.
What we have done with this tool is to get the main content of the blog post and its title. Take the example of exporting a single article. We open a blog post, showing the page source code, you can see the following content.

One of the " article_content"It corresponds to the CSDN blog Body Content. This is what we need in the export process. (You certainly don't want to have ads embedded in the exported article ...) So, we can get what we need with a simple two-line code:

For more information NSString *ljs = @ "document.getElementById (\" article_content\ "). InnerHTML"; NSString *LHTML1 = [WebView Stringbyevaluatingjavascriptfromstring:ljs];

Similarly article titleThis can be achieved by:

Gets the title NSString *ljs2 = @ "document.getElementById (\" Article_details\ "). Getelementsbyclassname (\" article_title\ ") [0 ].getelementsbytagname (\ "A\") [0].innertext]; NSString *LHTML2 = [WebView stringbyevaluatingjavascriptfromstring:ljs2];

A little further, we can even Modify the picture size of the displayed Web page

Modify picture size if ([LHtml1 rangeofstring:@ "


(iv) Custom HUD loading effect (non-traditional mum) iOS comes with a spinning daisy ... It must have been clear to everyone. But to be honest, that thing is really ugly. Select what we want to do is to show an unclosed circle, and the background view is a little darker, highlighting the loading process. The effect is as follows:


1. Import folder SVProgressHUD2. Add a header file
#import "SVProgressHUD.h"           //hud load Display
3. Display HUD
Show Hud[svprogresshud showwithmasktype:svprogresshudmasktypegradient];
4. Removing the HUD
Removal of Hud[svprogresshud dismiss];


Five UITableView List Basic operation this is the basic content, specifically can see blogexportedlist.m here. Detailed explanations are available. Here we highlight the followingLeft Slide delete operation。 1. Turn on run Delete mode 2. When the response is deleted, you need to do(1) Remove from list (2) Remove from data (3) Refresh list
Delete-(Uitableviewcelleditingstyle) TableView: (UITableView *) TableView Editingstyleforrowatindexpath: (Nsindexpath * ) indexpath{return uitableviewcelleditingstyledelete;} /* Change the Delete button's title*/-(NSString *) TableView: (UITableView *) TableView Titlefordeleteconfirmationbuttonforrowatindexpath :(Nsindexpath *) indexpath{return @ "delete";} /* Delete function */-(void) TableView: (UITableView *) TableView Commiteditingstyle: (Uitableviewcelleditingstyle)        Editingstyle Forrowatindexpath: (Nsindexpath *) indexpath{if (Editingstyle = = Uitableviewcelleditingstyledelete) { Gets the full path and initialization of the dictionary and array Nsarray *paths = Nssearchpathfordirectoriesindomains (NSDocumentDirectory, Nsuserdomainmas        K, YES);        NSString *documentsdirectory = [Paths objectatindex:0];                NSString * Namepath = [documentsdirectory stringbyappendingpathcomponent:@ "Csdninfo.plist"];                [Blogarr RemoveObjectAtIndex:indexPath.row];                [Blogarr Writetofile:namepath Atomically:yes]; [NameList RemoveobjEctAtIndex:indexPath.row]; [Mytableview Deleterowsatindexpaths:[nsmutablearray Arraywithobject:indexpath] Withrowanimation:  Uitableviewrowanimationautomatic]; Delete the corresponding data cell}}


(vi) The list of keywords fuzzy query search, is a very common function. If the simple keyword search, presumably everyone will.  But what we need is a fuzzy query. For example, to query "iOS development" When you enter I, o open, and so on, can find the corresponding data.
1. Import the query Word List Folder 2. Add a header file
Query sub-list #import "DDList.h" #import "PassValueDelegate.h"
3. Initialize the query list
Query list initialization    namelist = [[Nsmutablearray alloc]init];    for (int i =0; I<[blogarr count]; i++)    {        [namelist addobject:[[blogarr objectatindex:i]objectforkey:@ ' name ' ]];    }        Initialize the query string _searchstr = @ "";    Initialize reminder View _ddlist = [[Ddlist alloc] initwithstyle:uitableviewstyleplain];_ddlist._delegate = self; [Self.view Addsubview:_ddlist.view]; [_ddlist.view setframe:cgrectmake (108, 0)];    _ddlist._totallist = NameList;


4. Response query specific can look at the code, here emphasize one. When we find the data click, we need to automatically jump to the specified location. Otherwise the query is useless.
Hide Reminder View-(void) Setddlisthidden: (BOOL) Hidden{nsinteger height = hidden? 0:180;[ UIView Beginanimations:nil Context:nil]; [UIView setanimationduration:.2]; [_ddlist.view setframe:cgrectmake (108, max, height)]; [UIView commitanimations];} Singleton, returns the result of the selected reminder box #pragma mark-#pragma mark returns data-(void) Passvalue: (NSString *) value{//If selected, modifies the current search to return results, Call End Function Searchbarsearchbuttonclickedif (value) {_searchbar.text = value;[ Self Searchbarsearchbuttonclicked:_searchbar];} else {The character in the}}//search box changes when you call #pragma mark-#pragma mark Searchbar Delegate methods-(void) Searchbar: (Uisearchbar *) Searchbar Textdidchange: (NSString *) searchtext{//If the search box has content, update the prompt list if ([SearchText length]! = 0) {_ddlist._searchtext = SearchText; [_ddlist UpdateData]; [Self setddlisthidden:no];}  else {[Self setddlisthidden:yes]; Otherwise hidden}}//text box popup, start Search-(BOOL) searchbarshouldbeginediting: (Uisearchbar *) Searchbar{searchbar.showscancelbutton = YES ; for (id cc in [searchbar subviews]) {if ([Cc Iskindofclass:[uibutton class]]) {UIButton *btn = (UIButton *) cc;        [Btn settitle:@ "Cancel" forstate:uicontrolstatenormal]; }}return YES; Start the search response. -(void) searchbartextdidbeginediting: (Uisearchbar *) Searchbar{searchbar.text = @ "";} End text box input-(void) searchbartextdidendediting: (Uisearchbar *) Searchbar{searchbar.showscancelbutton = NO; Searchbar.text = @ "";} When one of the cue lists is selected, the search ends, the result is selected, and the highlight-(void) searchbarsearchbuttonclicked: (Uisearchbar *) searchbar{[self Setddlisthidden:  YES]; Hide hint View _searchstr = [Searchbar text];  Get query results [Searchbar Resignfirstresponder]; Retract the keyboard for (int i = 0; I<[blogarr count];//i++)//Find the result from the list, check {if ([[[[Blogarr OBJECTATINDEX:I]OBJECTF orkey:@ "name"] isequaltostring:_searchstr]) {Nsindexpath *indexpath = [Nsindexpath indexpathforrow:i in            SECTION:0];            [Mytableview Reloaddata]; [Mytableview Scrolltorowatindexpath:indexpath//scrolling View Atscrollposition:uitableviewscrollpo Sitionmiddle Animated:yes];                              [Mytableview Selectrowatindexpath:indexpath//Check Highlight Animated:yes        Scrollposition:uitableviewscrollpositionmiddle]; }}}//Cancel search response-(void) searchbarcancelbuttonclicked: (Uisearchbar *) searchbar{[self setddlisthidden:yes];[ Searchbar Resignfirstresponder];}

(vii) The basic operation of the picture here we need to do is, click on an image, jump to another view, where the view allows the general editing of the picture. Include the zoom of the picture ... You can see the MRZoomScrollView.h/. m two files in detail. The implementation method is explained below.
1. Add gestures.
    ADD gesture,double Tap Zoom ImageView.    UITapGestureRecognizer *doubletapgesture = [[UITapGestureRecognizer alloc] initwithtarget:self                                                                                action: @selector (Handledoubletap:)];    [Doubletapgesture Setnumberoftapsrequired:2];    [ImageView Addgesturerecognizer:doubletapgesture];

Our shrinkage is achieved through gesture recognition. For example, you drag two fingers, that is, to shrink. Two-finger click is auto-zoom, single-finger click is to exit the image browsing.
2. Responding to gesture actions
#pragma mark-zoom methods-(void) Handledoubletap: (Uigesturerecognizer *) gesture{    Float Newscale = Self.zoomscale * 1.5;    CGRect zoomrect = [self Zoomrectforscale:newscale withcenter:[gesture locationInView:gesture.view];    [Self Zoomtorect:zoomrect animated:yes];} -(CGRect) Zoomrectforscale: (float) scale withcenter: (cgpoint) center{cgrect zoomrect    ;    ZoomRect.size.height = Self.frame.size.height/scale;    ZoomRect.size.width  = self.frame.size.width  /scale;    zoomrect.origin.x = center.x-(zoomRect.size.width  /2.0);    ZOOMRECT.ORIGIN.Y = Center.y-(zoomrect.size.height/2.0);    return zoomrect;}


at this point, this simple tutorial is over. hope, can bring you a little gain. 
PS:
This article is participating in the 2014 CSDN blog competition. If you feel that it is helpful to you, hope to be able to cast a valuable vote.
Vote Link: http://vote.blog.csdn.net/Article/Details?articleid=31768677

study on the road, with June mutual encouragement.