swift - iOS中类似于此种图片+文字的视图是如何实现的？

Question

如下面的图所示，要求就是要达成上面一张图，下面可以是各种文字，各种图之类的，然后是可以上下滚动的。 作为详细页面，我想项目是固定的吧，比如，在这个页面中需要展示： 标题 一张图片 文章信息 文字内容 我...

天蓬老师 · Answer

The following answers are all from StackOverflow, but I can’t remember the source of the first one, so I’m sorry for not citing it.
It is recommended that the subject conduct necessary searches before or during the so-called "try". It is not advisable not to try to solve small problems.

Try solution 1:

Add the following statement to the UITableView in Group style to eliminate the top horizontal bar

[tableView setTableHeaderView:[[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, self.bounds.size.width, 0.01f)]];

Try solutions 2&3:

Only display cells containing data, without displaying redundant table dividing lines

Quoted from related answers on StackOverflow

self.theTableView.tableFooterView = [[[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 10.0f)] autorelease];

高洛峰 · Answer

If you just add text to the picture (no cell), you can use UIScrollview. If you have a cell, put the picture and text on the headerView of the cell. One point involved in this is to calculate the height of the text. (You can use Autolayout layout).

迷茫 · Answer

Sliding uitableview hides navigation bar self.navigationController.hidesBarsOnSwipe = YES;

ringa_lee · Answer

First of all, among the four solutions given by the questioner, I think the last three can meet the needs of the questioner, but did the questioner not seriously solve one of them? Let me show you how to solve it in turn.

Try 2 and 3 to solve the problem

If you try these two, you will be able to solve it in no time. Have you searched how to remove redundant UItable lines?

Because the questioner uses UITableView, let’s go directly to the code.

//viewDidLoad中加入
if ([self.tableView respondsToSelector:@selector(setSeparatorInset:)]) {
        [self.tableView setSeparatorInset:UIEdgeInsetsZero];
    }

    if ([self.tableView respondsToSelector:@selector(setLayoutMargins:)]) {
        [self.tableView setLayoutMargins:UIEdgeInsetsZero];
    }


//.m中加入
#pragma mark －－table分割线
- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    if ([cell respondsToSelector:@selector(setSeparatorInset:)]) {
        [cell setSeparatorInset:UIEdgeInsetsZero];
    }
    // Prevent the cell from inheriting the Table View's margin settings
    if ([cell respondsToSelector:@selector(setPreservesSuperviewLayoutMargins:)]) {
        [cell setPreservesSuperviewLayoutMargins:NO];
    }
    if ([cell respondsToSelector:@selector(setLayoutMargins:)]) {
        [cell setLayoutMargins:UIEdgeInsetsZero];
    }
}

Try four solutions

The focus of using UIScrollView itself is to solve the height and width problems. But I can't see the original poster's code. I keep rotating it and post it to see what's going on.

The question is, even if the image is not displayed, since you set the image height to 200, how come the calculation is messed up?

The possible reason is
1. Your label height is not calculated correctly
2. Your calculation code is in the wrong location. viewDidAppear calculated in

There is no code, so the reason above is guesswork.

巴扎黑 · Answer

I use webView all the time..

PHPz · Answer

webView is simple and flexible

阿神 · Answer

I have also been troubled by this problem for a very, very long time. .
The final solution is to use TableView.
Just customize a few more Cells with different IDs.

The problem I encountered is probably this:
There are five types of Cells ABCDE.
Situation 1: 1A+2B+3C+4D+5E is required;
Situation 2: 5A+4B+3C+2D+1E is required;
The data that needs to be filled in each Cell is different.

The final solution is to encapsulate the Cell ID into an array. In the Data Source, the corresponding Cell is retrieved based on the array of Cell IDs and filled with content.

As for other heights, dividing lines, disappearing navigation bars, etc., these are all minor issues, please Google.

巴扎黑 · Answer

My current temporary solution is to "try two".

The first Cell serves as tableHeader, and the second Cell contains text content.

Put the Label or TextView into the third Cell, and then use self-layout to automatically expand the Label and TextView. For specific implementation methods, please refer here:

http://www.ifun.cc/blog/2014/02/21/dong-tai-ji-suan-uitableviewcellgao...

(Looks like you need to circumvent the wall)

迷茫 · Answer

As the left and right pictures, the developer of @用家app

The overall layout of the entire View is done using UICollectionView. The comments section below uses UITableView.

Because the entire application is based on the MVVC architecture, the overall post code will be relatively messy. But the general method is to customize the cell after defining the structure of the View. This is to take care of some complex interactions, so it is written in native code. If you really need to develop quickly, use UIWebView to do it, and the development efficiency will definitely be very high. However, some effects of loading interaction must be done well to ensure a good user experience.

迷茫 · Answer

Use headerview for the top image and adjust it dynamically

swift - iOS中类似于此种图片+文字的视图是如何实现的？

尝试一

尝试二

尝试三

尝试四

reply all(11)I'll reply

Try 2 and 3 to solve the problem

Try four solutions