Preface:

OC has always been used in projects at work. Recently, normal iterations of the company’s project launch were relatively idle. I planned to write a Swift project to keep my hand in my hand, and I chose to imitate the writing of demonic cartoons. Another imitation wrote a Himalayan FM, interested in can go to see.

The project uses the MVC design pattern, the Moya+ HandyJson network layer and data parsing, and some of the best tripartite libraries used in the project, such as the ESTabBarController for the tabBar that drives the drawing, are described below

Below first look at the current completion of the effect diagram

Home analysis:

It can be seen that the style of the home page is very similar to the UI style of the AppStore’s home page, which is based on the date and stage of a few large images and small series of recommendations. I used the partition TableView for the home page part and the TableViewCell for the large image part. The display area above Sunday is used as the tableView’s headerView, and the recommended part below is used as the footerView of tableView, where the footerView is nested within the collectionView to display the comics recommended by the editor

Discovery module analysis:

The discovery module uses a custom navigation bar, which is divided into four sub-modules: recommendation, VIP, subscription and ranking

Discovery – Home Page Analysis:

The first section is the scroll picture and list gird button. Then the other sections choose different styles and item numbers according to the data model. I’m going to set the size of the first section’s headerView to.zero, Set the size of footerVeiw of the last section to.zero. Click on gird and Section headerView to view more buttons

Home page click find – recommended above different list button and click find – ranking module can jump list out different types of interface, the interface is using a tableview displays, different kinds of ranking will have some differences, mainly reflected in the top three MEDALS, bold font identifier and the first face is heat or clicks or collection, etc., This is mainly based on the data model processing

Discover other submodule analysis:

It is easy to find the other sub-modules of the module, including VIP and subscription layout, which also adopts the partition collectionView, headerView according to the data model to display the title and whether to display. Click on the right to see more buttons. The ranking submodule uses the collectionView partition to display several rankings

Comic Details module:

This module can be said to be the most important module of the whole demonic, in order to beautiful details interface is used to come in to hide the navigation bar, and then when the interface moves up to display the navigation bar. The cartoon graphic introduction at the top of the module as headerView, there is a Beijing fuzzy frosted glass effect, for the projection of cartoon pictures, At the bottom of the three categories of sub-page details, directory, evaluation, the module used the paging effect of the tripartite library SwipeMenuViewController, as well as the navigation bar gradually displayed the tripartite library WRNavigationBar

Detailed interface analysis:

The details interface adopts partitioned tableView. According to the style requirements, the headerView of the first section is hidden, and the first partition is the introduction part of the work. The height of the cell should be adjusted according to the length of the introduction text returned by the data model. Then, according to the data model, determine whether the author has other works and decide whether to display the cell of other works. Guess you like the module is a nested collectionView

Catalog interface analysis:

The catalog interface is a collectionView item that shows the title based on the data, and the headerView that shows updates and sorts (positive and reverse order) for easy reading

  ifIsPositive {// Positive cell.chapterStatic = detailStatic? .chapter_list? [indexPath.row] }else{ cell.chapterStatic = detailStatic? .chapter_list? .reversed()[indexPath.row] }Copy the code

Evaluation interface analysis:

Evaluation interface is mainly tableView list display evaluation content on the line, according to the data returned evaluation content to adjust the height of the list of three sub-pages according to the specific online mobile, to send notice notice details of the main page scrolling up and display the navigation bar effect

My module analysis:

My interface is mainly to use the tableView list display, the top area head monster coins, monthly tickets as a whole headerView

Write at the end:

The project is very simple, the interface is very few logic processing is very simple, the project is basically completed, bookshelf module and some details will be improved later, interested friends can download the source code to have a look, any questions and suggestions can be github and Jane book contact me, thank you for your support

Finally put the project source code

Github:github.com/daomoer/YYS…

Add:

The second imitation project is Github:Swift high imitation Himalaya App

Brief description: Swift highly imitated Charles, one of the Himalayan apps, to capture packages, image resources acquisition, etc

The project reference: www.jianshu.com/p/951236319…