簡體   English   中英

UITableView背景為平鋪圖像

[英]UITableView background as tiled image

我的iPhone上的圖像高度約為1,5。 我想把它作為UITableView的連續背景。 它必須滾動表。 有什么辦法嗎?

您可以將此圖像轉換為可以無限重復的圖案作為表格視圖的背景。 首先,這樣做:

UIColor *backgroundPatternColor = [UIColor colorWithPatternImage:myImage];

然后將表視圖的背景顏色或任何其他視圖的背景顏色設置為backgroundPatternColor

有簡單的解決方案。

使用此代碼為表格視圖設置背景圖案圖像(圖案圖像可能是您想要平鋪的小圖像):

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.tableView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"back"]];
}

平鋪圖像將向上和向下無限平鋪,並使用tableView滾動。

然后做下一個重要的技巧 - 為單元格設置透明背景顏色,因為設置tableView backgroundColor也會將平鋪背景設置為單元格:

- (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    cell.backgroundColor = [UIColor clearColor];
}

對簡單的tableView單元使用此方法,否則復雜單元的透明背景會導致性能不足。

表格視圖滾動在很大程度上是一種錯覺,因為當用戶滑動/滾動表單元格時,表格單元格在未被使用時排隊並且當再次需要新單元格時將其出列。 我們經常將此稱為跑步機效果,您在屏幕上看到的就像跑步機的腰帶。 它僅存在於視口中,並且實際上不會滾動得更遠,盡管它看起來不然。 這意味着您的表格視圖的背景圖像將固定到位,而不是與您的單元格一起滾動。

我認為,在你的單元格中滾動圖像的唯一方法就是將圖像分解成單元格的大小,並將每個單元格的背景設置為該索引路徑的圖像。

所以說你有一個像這樣的表視圖:

         CELLS            INDEX PATH
|----------------------|
|          |           |  0, 0
|----------------------|
|        /   \         |  0, 1
|----------------------|
|      YOUR IMAGE      |  0, 2
|----------------------|
|        HERE          |  0, 3
|----------------------|
|        \   /         |  0, 4
|----------------------|

將圖像預先切割成相同尺寸的部分,這些部分是細胞的正確高度。 然后,您可以在cellForRowAtIndexPath獲取索引路徑的行,並根據該行設置單元格的背景圖像。 如果您的圖像高度超過圖像高度,則最終可能會耗盡圖像,但是,這很容易檢查。

如果您將圖像命名為background_0.png,background_1.png等,則可以獲取所需的圖像,如下所示:

UIImage *imageForCell = [UIImage imageNamed:[NSString stringWithFormat:@"background_%d", [indexPath row]]];
[[cell backgroundImageView] setImage:imageForCell];

其中backgroundImageView是您添加到自定義單元格的圖像視圖。

您要求為您的桌子設置平鋪的滾動背景。 通常用於在tile中滾動的東西的UI是一個表。 所以用一張桌子作為你的背景:)

您需要兩個表:backgroundTableView和contentTableView。 contentTableView是您需要的任何內容,但請確保將單元格和表格的背景顏色和視圖設置為clear / nil。

backgroundTableView包含您的平鋪圖像:也就是說,每個單元格應該是平鋪圖像的高度,並且應該包含平鋪圖像。

然后滾動contentTableView時,更新backgroundTableView的contentOffset以匹配:

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {

    if (scrollView == self.contentTableView) {
        self.backgroundTableView.contentOffset = self.contentTableView.contentOffset;
    }
}

確保將控制器設置為兩個表的dataSource和委托。 此外,請確保backgroundTableView中有足夠的“內容”(行數*高度),它可以繼續滾動,直到至少在contentTableView的末尾。

Aaaaaand完成了!

UITableView繼承自UIScrollView。 我建議您將圖像添加為UITableView層次結構的自定義子視圖。

UIImageView *imageView = [UIImageView alloc] initWithImage:myImage];
[self.tableView insertSubview:imageView atIndex:0];

現在,您可能需要繼承UITableView並提供自己的實現

    - (void)layoutSubviews
{
    [super layoutSubviews];
    [self sendSubviewToBack:myImageView];
}

我只是把這個代碼從頭頂拉出來,所以你可能需要擺弄它。

您可以將圖像設置為表格的背景視圖。

self.tableView.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"YOUR_BACKGROUND_IMAGE"]];

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM