iOS - UITableViewCell 图像调整/调整大小

Posted 2023-02-25

【中文标题】iOS - UITableViewCell 图像调整/调整大小

【英文标题】：iOS - UITableViewCell image adjust/resize

【发布时间】：2013-12-31 17:40:41

【问题描述】：

我创建了一个表格视图并用文本填充了它的单元格。我想做的是向单元格添加图像，但发生的事情是图像覆盖了整个单元格，看起来很糟糕......

这就是我正在做的事情：cell.imageView.image = [UIImage imageNamed:@"test2.jpeg"];

这就是它的样子：

我想让它看起来像：

如何调整表格视图单元格的图像大小以获得所需的结果？

更新

这是我在以下答案中尝试过的建议：

cell.imageView.frame = CGRectMake(0.0f, 0.0f, 30.0f, 30.0f);
cell.imageView.layer.cornerRadius = 8.0;
cell.imageView.contentMode = UIViewContentModeScaleAspectFit;
cell.imageView.layer.masksToBounds = YES;
cell.imageView.image = [UIImage imageNamed:@"test2.jpeg"];

但我得到的输出仍然是：

更新 2.0

我尝试了其他一些建议的方法：

UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(30, 30, 30, 30)];
imageView.backgroundColor = [UIColor clearColor];
[imageView.layer setCornerRadius:8.0f];
[imageView.layer setMasksToBounds:YES];
[imageView setImage:[UIImage imageNamed:@"test2.jpeg"]];
[cell.contentView addSubview:imageView];

但现在我得到了这个：

【参考方案1】：

首先，您需要将单元格的 imageView 设置为您想要的最大尺寸。然后通过 Interface Builder 或代码确保您具有正确的内容模式：

cell.imageView.contentMode = UIViewContentModeScaleAspectFit;

基本上使用此模式，它会尝试适应您为图像创建的空间，但会保持纵横比。

Jackson 发布了一张很好的图片，显示了here 的内容模式：

对于角落，您将需要 QuartzCore，您可以使用以下代码进行设置：

#import <QuartzCore/QuartzCore.h>

...

cell.imageView.layer.cornerRadius = 4;
cell.imageView.layer.masksToBounds = YES;

更新

如果您的 imageView 不是插座，您最好自己添加一个 imageView 到单元格中。您可以（并且应该）通过故事板/xib 做到这一点。 This tutorial might help you 对此，尽管互联网上有很多。 This *** question 为该问题提供了其他解决方案。

【讨论】：

但是我不明白为什么当我使用cell.imageView.frame = CGRectMake(0,0,30,30); 设置图像视图的帧大小时它不起作用。它仍然显示问题中显示的图像

请同时使用 cell.imageView.layer.masksToBounds = YES;检查角落是否变圆。这有点奇怪。在此之后，您可能正在另一个地方更改 imageView。该推特图像是单元格的默认图像，或者您使用 cell.imageView.image = [UIImage imageNamed:@"test2.jpeg"]; 设置它?或者两者兼而有之？

谢谢，我已经添加了。并且没有 about sn-p，就没有放置图像视图...

抱歉，我认为您的 imageView 是您在 storyboard/xib 中添加的 imageView 的 Outlet。实际上，最好这样做。请检查这个为您的问题提供多种解决方案的 *** 线程 -> ***.com/questions/2788028/…

我查看了那个问题，发现了一些可行的方法，但并没有真正给我想要的结果。我已经用现在发生的事情更新了问题...感谢您的帮助！

【参考方案2】：

我花了最后几个小时来弄清楚如何做到这一点，所以我将分享我的发现。更新 2.0 中的代码是一个好的开始：

UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(30, 30, 30, 30)];
imageView.backgroundColor = [UIColor clearColor];
[imageView.layer setCornerRadius:8.0f];
[imageView.layer setMasksToBounds:YES];
[imageView setImage:[UIImage imageNamed:@"test2.jpeg"]];
[cell.contentView addSubview:imageView];

你可以把第一行的数字弄乱，让图片出现在你需要的地方；出于我的目的，我使用了(20, 5, 40, 40)。

在[cell.contentView addSubview:imageView]之前添加这一行：

[imageView setTag:99];

我们需要这个标签来识别我们刚刚添加的子视图。如果每次重新加载单元格时不删除图像，图像就会开始堆积在那里。对于您的情况，这并没有太大区别，因为它将继续使用相同的图像，因此看起来相同。但是，如果您有一个喜欢上下滚动的用户，您可能会遇到加载数百或更多这些图像的问题。如果您的单元格将有不同的图像，它们将开始显示在彼此之上，如果它们的大小不同，这将看起来非常糟糕。所以在你初始化*imageView之前，运行这个循环：

for (UIImageView *subview in cell.contentView.subviews)

    if (subview.tag == 99)
    
        [subview removeFromSuperView];
    

使用此代码，您的图像应该看起来与更新 2.0 中的相同，但它应该运行得更好。要移动文本，请使用 cell.indentationLevel 和 cell.indentationWidth。确保您的单元格样式设置为“基本”（看起来像您的），并且在您归还单元格之前，请使用

cell.indentationWidth = 10; // The amount each indentation will move the text
cell.indentationLevel = 7;  // The number of times you indent the text

所以这段代码会将文本移动超过 10 点 7 次。你可以玩它直到你让它看起来正确；这正是我在项目中使用的。希望这会有所帮助！

【讨论】：

这两行超级喜欢 cell.indentationWidth = 10; // 每个缩进移动文本的量 cell.indentationLevel = 7; // 缩进文本的次数

应该是removeFromSuperview（没有大写V）

【参考方案3】：

您可以编辑图像本身吗？尝试将图像编辑成您想要的大小并手动圆角。然后调用

  cell.imageView.image = [UIImage imageNamed:@"test3.jpeg"];

【参考方案4】：

实现这一点的最佳方法是在您调用cell.imageView.image的地方添加以下内容

cell.imageView.contentMode = UIViewContentModeScaleAspectFill;

对于圆角#import <QuartzCore/QuartzCore.h>

cell.imageView.layer.cornerRadius = 8.0;