咨询：是否存在类似iOS中NSString的字符串尺寸获取函数？

Great question! For your bottom sheet use case—where the initial height needs to be determined by the text content it displays—every major platform/framework has tools that mirror the functionality of iOS's NSString.size(withAttributes:) or boundingRect(with:options:attributes:context:). Here's how to implement this across common environments:

Web (JavaScript) #

If you're building a web-based bottom sheet, you can use either of these approaches:

• Hidden DOM Element Method (most accurate for wrapped text):
  Create an invisible element that matches your bottom sheet's text styling and width constraints, then measure its rendered size:

  function getTextDimensions(text, fontStyle, maxWidth) {
    const hiddenElement = document.createElement('div');
    // Match your bottom sheet's text styles exactly
    hiddenElement.style.visibility = 'hidden';
    hiddenElement.style.position = 'absolute';
    hiddenElement.style.font = fontStyle; // e.g., "14px 'Roboto', sans-serif"
    hiddenElement.style.width = maxWidth ? `${maxWidth}px` : '100%';
    hiddenElement.style.whiteSpace = 'normal';
    hiddenElement.textContent = text;
    
    document.body.appendChild(hiddenElement);
    const size = {
      width: hiddenElement.offsetWidth,
      height: hiddenElement.offsetHeight
    };
    document.body.removeChild(hiddenElement);
    
    return size;
  }
  

  You can use the returned height value directly to set your bottom sheet's initial height.

• Canvas Method (for single-line text):
  Good if you only need to measure unbroken text strings, like a title:

  function getSingleLineTextWidth(text, fontStyle) {
    const canvas = document.createElement('canvas');
    const ctx = canvas.getContext('2d');
    ctx.font = fontStyle;
    return ctx.measureText(text).width;
  }
  

Android (Kotlin) #

On Android, use Paint and StaticLayout to calculate the exact height of your text given its styling and maximum width:

fun calculateTextHeight(text: String, textSize: Float, maxWidth: Int, typeface: Typeface): Int {
    val textPaint = Paint().apply {
        this.textSize = textSize
        this.typeface = typeface
        isAntiAlias = true
    }
    val layout = StaticLayout.Builder.obtain(text, 0, text.length, textPaint, maxWidth)
        .setAlignment(Layout.Alignment.ALIGN_NORMAL)
        .setLineSpacing(0f, 1f) // Match your line spacing
        .build()
    return layout.height
}

Call this function with your bottom sheet's text and styling, then use the result to set the initial height of your bottom sheet view.

Flutter #

Flutter has a dedicated TextPainter class that makes this straightforward—perfect for dynamic bottom sheet heights:

Size getTextRenderSize(String text, TextStyle style, double maxWidth) {
  final textPainter = TextPainter(
    text: TextSpan(text: text, style: style),
    maxLines: null, // Allow text to wrap as needed
    textDirection: TextDirection.ltr,
  )..layout(maxWidth: maxWidth); // Constrain to your bottom sheet's width
  return textPainter.size;
}

// Usage example in your bottom sheet setup:
final textSize = getTextRenderSize(
  "Your initial bottom sheet text here",
  TextStyle(fontSize: 14, fontFamily: 'Roboto'),
  MediaQuery.of(context).size.width - 32, // Account for padding
);
// Use textSize.height to set the initial bottom sheet height

Key Takeaway #

Across all platforms, the core idea is the same:

• Replicate the exact styling and width constraints your text will have in the bottom sheet
• Let the framework/renderer calculate the text's natural rendered size
• Use that size to set your bottom sheet's initial height dynamically

This ensures your bottom sheet fits the text perfectly on first load, just like you'd do with NSString on iOS.

内容的提问来源于stack exchange，提问作者Filip Raj