如何在 Obj C 中的 UIImageView 顶部绘制横幅

Posted 2023-03-11

【中文标题】如何在 Obj C 中的 UIImageView 顶部绘制横幅

【英文标题】：How can I draw a banner at the top of a UIImageView in Obj C

【发布时间】：2016-10-20 12:15:41

【问题描述】：

一些背景

我正在创建一项功能，使用户能够将我的应用程序中的一些图像分享到他们的 Facebook/Twitter 帐户。

该功能有效，我实现了 IBAction，我可以在 Facebook 和 Twitter 中分享一些图片。

问题

我公司的营销部门现在要求我在共享图像的顶部添加带有公司徽标和日期的横幅。

这是我必须展示的：

现在我只分享白色矩形。现在我必须添加这个横幅，蓝色矩形。

我的想法

我想知道我将如何开发它。首先，我正在考虑以编程方式在视图中绘制它。

UIView *banner  = [[UIView alloc] initWithFrame:CGRectMake(0, 35, self.view.frame.size.width, 60)];
banner.backgroundColor = [UIColor blueColor];
[self.view addSubview:banner];

问题是我真的不知道如何调整大小以适应所有不同的屏幕尺寸。而且，如何在这个矩形内添加徽标、标签日期，最后，如何将它放入我共享的 UIImage 中

然后我想知道，“也许我可以像在 android 中那样直接在 XML 文件中绘制它”。但从我所有的调查来看，以编程方式执行它看起来更容易。

需要帮助

我希望得到一些建议，以便让自己专注于更好的开发方式，因为现在我的想法有点模糊。

感谢您的阅读。

【问题讨论】：

那么你到底想要什么，想在横幅图像上的图像上绘制标志（核心重绘图像，使图像具有标志和横幅图像）。或者尝试在图像视图上添加徽标。

我已经用快速图形表示编辑了我的问题，以便您了解我的需求。

【参考方案1】：

你可以这样做

考虑 img1 是您从 URL 获得的图像。 这里我取了一个bannerView，你可以在里面添加标签和图片。

代码：

UIImage *img1 = [UIImage imageNamed:@"Screen.png"];

//Only banner view, on which we will design the label and logo
UIView *vwBanner = [[UIView alloc] initWithFrame:CGRectMake(0, 0, img1.size.width, 60)];
vwBanner.backgroundColor = [UIColor grayColor];

//Logo design
UIImageView *imgVwLogo = [[UIImageView alloc] initWithFrame:CGRectMake(CGRectGetWidth(vwBanner.frame) - 100 , 0, 100, 100)];
imgVwLogo.backgroundColor = [UIColor redColor];
[vwBanner addSubview:imgVwLogo];

//Label design
UILabel *lbl = [[UILabel alloc] initWithFrame:CGRectMake(40, 0, CGRectGetWidth(vwBanner.frame) - imgVwLogo.frame.size.width, CGRectGetHeight(vwBanner.frame))];
lbl.text = @"Thurseday, 20 October 2016";
[vwBanner addSubview:lbl];


//Full view which contains the downloaded image and banner image
UIView *vwWithBanner = [[UIView alloc] initWithFrame:CGRectMake(0, 0, img1.size.width, img1.size.height+vwBanner.frame.size.height)];
[vwWithBanner addSubview:vwBanner];

//imageView with downloaded image 
UIImageView *imgVw = [[UIImageView alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(vwBanner.frame), img1.size.width, img1.size.height)];
imgVw.image = img1;
[vwWithBanner addSubview:imgVw];

//Draw the image of full view
UIGraphicsBeginImageContextWithOptions(vwWithBanner.bounds.size, NO, img1.scale);
[vwWithBanner drawViewHierarchyInRect:vwWithBanner.bounds afterScreenUpdates:YES];

UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

输出：

看到灰色条是横幅视图，下面是图像。我没有图像所以截取了模拟器的屏幕截图来演示示例。

【讨论】：

这正是我要问的。我会接受这个答案，因为它会帮助我走得更远。也感谢@Aneesh。

但是是否可以使用图像和横幅创建一个新视图，使横幅不在图像上，而是在图像上方？

是的，这就是我在这里演示的。 vwBanner 位于 imageView 上方。在我的情况下，灰色的是添加的图像。我已将 View 的背景颜色添加为灰色，当您在其上放置图像然后拍摄图像时，它会随心所欲地出现。

看我已经更新了与您的要求基本相似的答案。

你说得对，我以为它不在上面，但它是。谢谢你。我将开始添加日期和徽标。

【参考方案2】：

 UIView *banner  = [[UIView alloc] initWithFrame:CGRectMake(0, 35, self.view.frame.size.width, 60)];
banner.backgroundColor = [UIColor blueColor];


UIImageView *imgBanner=[[UIImageView alloc] initWithFrame:CGRectMake(0, 0, banner.frame.size.width, banner.frame.size.height)];
    [imgBanner setImage:@"img.png"];
     imgBanner.contentMode = UIViewContentModeScaleAspectFit;

[banner addSubView:imgBanner];
[self.view addSubview:banner];

【参考方案3】：

获取图片后调用此方法，

UIImage *img = [self drawText:@"Some text"
                            inImage:img 
                            atPoint:CGPointMake(0, 0)];

这样的功能实现，

+(UIImage*) drawText:(NSString*) text 
             inImage:(UIImage*)  image 
             atPoint:(CGPoint)   point 


UIFont *font = [UIFont boldSystemFontOfSize:12];
UIGraphicsBeginImageContext(image.size);
[image drawInRect:CGRectMake(0,0,image.size.width,image.size.height)];
CGRect rect = CGRectMake(point.x, point.y, image.size.width, image.size.height);
[[UIColor whiteColor] set];
[text drawInRect:CGRectIntegral(rect) withFont:font]; 
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

return newImage;

【讨论】：

我从没提过拍照。我只分享我从服务器检索的应用程序中的一些图像。

所以你将从服务器获取图像到你的类方法对吗？

是的，我有一个 URL，我可以从中获取我的图像。我目前正在将这张图片分享到 Facebook/Twitter。现在我只需要添加一个横幅（蓝色矩形），我必须绘制自己并将其“定位”在顶部或创建一个由 2 个图像组成的新图像。

但是我不需要 imagePickerController 对吧？那么我为此做什么 [(UIImage *)[info objectForKey:UIImagePickerControllerOriginalImage] drawInRect:CGRectMake(0, 0, 320, 480)];

@Funnybear 你检查过更新的答案吗，其中只包括一种方法，在获取图像后将从你的响应中调用。