在ios中实现图片环绕文字效果

IOS中有时候需要实现文字环绕图片的效果,用一般的控件很难实现,因为根本就没有支持该属性的控件,折衷的做法就是用UIWebView,在其加载html语言,实现文字的环绕效果。

实现要求:在webView上实现文字环绕图片,点击图片可实现图片放大。

关于点击图片放大有两种方法:1.用javascript脚本实现,可笔者已经3年不做web开发了,这种方式可能需要较长时间。2.在webView中添加一个占位图(必须是透明的),在

web.scrollView上相应位置,添加UIImageView,并实现点击效果。

以下时部分代码:

newsTitle=@"标题";

       newsTime=[NSString stringWithFormat:@"%@                     %@",@"2012-08-09",@"网易"];

       NSString *file1 = [[NSBundle mainBundle] pathForResource:@"占位图" ofType:@"png"];//设置占位图片

       NSString *file2 = [[NSBundle mainBundle] pathForResource:@"透明" ofType:@"png"];//设置占位图片

       NSString *imgstr=[NSString stringWithFormat:@"<img src='file://%@' style=\"FLOAT: right; MARGIN-TOP: 10px; MARGIN-RIGHT: 10px\" alt=\"\">",nil,nil];//红色的就是占位图的属性设置:居右,距离上边 10px,距离右边10px

       web.backgroundColor = [UIColor clearColor];  

       web.opaque = NO;

       //这行能在模拟器下明下加快 loadHTMLString 后显示的速度,其实在真机上没有下句也感觉不到加载过程

       web.dataDetectorTypes = UIDataDetectorTypeNone;

       if (!news) {

           news=@"要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字要添加的文字";

       }

       NSString *webviewText = [NSString stringWithFormat:@"<style>body{margin:10;align:center;background-color:lightgray;font-color:black;font:17px/20px Custom-Font-Name}</style><h2 align=\"center\">%@</h2><h5 style='text-align:center;'>%@</h5><hr></br>%@<font>%@</font>",newsTitle,newsTime,imgstr,news];//红色部分将文字图片连接在一起


       [web loadHTMLString:webviewText baseURL:nil]; // WebView 中显示本地的字符串

       //在于占位图同样的添加图片

       UIView *firstView=[self addImageViewWithFrame:CGRectMake(203, 125, 100, 97) andPic:pic1];

       [firstView setTag:9];

       [web.scrollView  addSubview:firstView];

       [web.scrollView addSubview:[self addImageViewWithFrame:CGRectMake(203, 226, 100, 97) andPic:pic2]];


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值