根据文字和字体大小计算高度

//屏幕宽度

#define kSCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width

//屏幕高度

#define kSCREEN_HEIGHT [[UIScreen mainScreen] bounds].size.height

//系统版本判断

#define iOS(version) (([[[UIDevice currentDevice] systemVersion] intValue] >= version)?1:0)


#pragma mark - - sizeWithText


- (CGSize)sizeWithText:(NSString *)text fontSize:(CGFloat)fontSize maxWidth:(CGFloat)maxWidth{

    

    CGSize size ;

    if (iOS(7)) {

        

        NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStylealloc]init];//关键

        paragraphStyle.lineBreakMode =NSLineBreakByCharWrapping;//折行方式

        

        NSDictionary * dict = [NSDictionarydictionaryWithObjectsAndKeys:[UIFontsystemFontOfSize:fontSize],NSFontAttributeName,paragraphStyle.copy,NSParagraphStyleAttributeName,nil];

        size =[text boundingRectWithSize:CGSizeMake(maxWidth,MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin|NSStringDrawingUsesFontLeading attributes:dict context:nil].size;

    }else{

        size = [text sizeWithFont:[UIFontsystemFontOfSize:fontSize] constrainedToSize:CGSizeMake(maxWidth,MAXFLOAT) lineBreakMode:NSLineBreakByCharWrapping];//折行方式

    }

//    NSLog(@"------%@",NSStringFromCGSize(size));//{300, 286.32000000000005}

    

    size.height =ceil(size.height);


//    NSLog(@"===%@",NSStringFromCGSize(size));//{300, 287}

    return size;

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以通过CSS的calc()函数和vw单位实现文字大小根据容器宽度自适应的效果,具体实现如下: 1. 给容器设置一个固定的高度和宽度,并设置overflow:hidden,保证文字不会溢出容器。 ```css .container { height: 300px; width: 100%; overflow: hidden; } ``` 2. 在容器内部,使用一个文本框来显示要自适应字体大小文字,并设置字体大小为一个较大的值,如80px。 ```html <div class="container"> <textarea class="text" v-model="message"></textarea> </div> ``` ```css .text { font-size: 80px; border: none; background-color: transparent; resize: none; width: 100%; height: 100%; } ``` 3. 使用calc()函数和vw单位来计算字体大小,其中calc()函数可以进行数学运算,vw单位是相对于视口宽度的单位。 ```css .text { font-size: calc(80px + (100vw - 600px) * 0.1); } ``` 上面的代码表示,当视口宽度为600px时,字体大小为80px,当视口宽度增加到1000px时,字体大小会自动增加10%。 4. 在Vue中,可以使用计算属性来动态计算文本框的样式。 ```html <div class="container"> <textarea class="text" v-model="message" :style="textStyle"></textarea> </div> ``` ```javascript export default { data() { return { message: '' } }, computed: { textStyle() { const baseFontSize = 80; const viewportWidth = window.innerWidth; const fontSize = baseFontSize + (viewportWidth - 600) * 0.1; return { fontSize: `${fontSize}px` } } } } ``` 上面的代码中,textStyle是一个计算属性,根据视口宽度动态计算字体大小,然后返回一个包含fontSize属性的对象,作为文本框的样式。 这样,就可以实现根据文字数量自动计算字体大小的效果了。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值