如何在 UITextView 中垂直对齐文本
Posted
技术标签:
【中文标题】如何在 UITextView 中垂直对齐文本【英文标题】：How to align text vertically in middle in UITextView 【发布时间】：2019-05-29 00:17:44 【问题描述】：我正在尝试将UITextView中的文本垂直居中对齐。搜索后，我找到了代码，它似乎可以工作，直到我们开始键入并在光标跳转时按 Enter 键。当我们在文本视图中键入时按 Enter 键时，光标会跳转以调整其位置，我假设这是由于它被调用/实现的方式。
有没有更好更优雅的解决方案？
我已将其实现为 UITextView 扩展。此代码取自Center text vertically in a UITextView 上建议的解决方案之一
我的问题是解决跳跃问题。这不是上述问题的重复。
extension UITextView
func alignTextVerticallyInContainer()
let fittingSize = CGSize(width: bounds.width, height: CGFloat.greatestFiniteMagnitude)
let size = sizeThatFits(fittingSize)
let topOffset = ((bounds.size.height - size.height * zoomScale) / 2)
let positiveTopOffset = max(1, topOffset)
contentOffset.y = -positiveTopOffset + 1
然后调用它
override func viewDidLayoutSubviews()
textView.alignTextVerticallyInContainer()
【问题讨论】：
Center text vertically in a UITextView的可能重复 【参考方案1】：您只需使用自动布局即可完成此操作 - 无需代码。
首先添加一个UIScrollView - 我已将其限制为从顶部开始 80-pts，每侧 20-pts，高度限制为240（我将背景设置为橙色，以便于查看）：
接下来，添加一个标准的UIView 作为scrollView 的子视图（我将背景设置为青色以便于查看）。在每一侧以及顶部和底部约束它8-pts（用于一点填充）。将其 Width 约束为等于 scrollView 的 Width，常数为 -16（用于侧边距），并将其 Height 约束为等于 scrollView 的高度，常数为 -16（用于顶部/底部填充）。
关键点：将Height约束的Priority设置为Low (250)。这将允许它在需要时增长：
现在添加一个UITextView 作为青色视图的子视图。仅从一行文本开始。从每一侧约束它8-pts（用于填充）；将其>= 8-pts 限制在顶部和底部；并在跨度视图中将其垂直居中：
当您运行应用程序时，它应该像这样运行（同样，不需要代码）：
这里是故事板的来源：
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="14460.31" targetRuntime="ios.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES" initialViewController="LZe-dy-wRt">
<device id="retina4_7" orientation="portrait">
<adaptation id="fullscreen"/>
</device>
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="14460.20"/>
<capability name="Safe area layout guides" minToolsVersion="9.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<scenes>
<!--View Controller-->
<scene sceneID="k3M-Zu-xX0">
<objects>
<viewController id="LZe-dy-wRt" sceneMemberID="viewController">
<view key="view" contentMode="scaleToFill" id="fZP-6s-NIY">
<rect key="frame" x="0.0" y="0.0" />
<autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
<subviews>
<scrollView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="guO-HM-qxH">
<rect key="frame" x="20" y="100" />
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="zW5-KI-gna">
<rect key="frame" x="8" y="8" />
<subviews>
<textView clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="scaleToFill" scrollEnabled="NO" text="Start with one line." textAlignment="natural" translatesAutoresizingMaskIntoConstraints="NO" id="S6g-U0-TeD">
<rect key="frame" x="8" y="95.5" />
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<fontDescription key="fontDescription" type="system" pointSize="14"/>
<textInputTraits key="textInputTraits" autocapitalizationType="sentences"/>
</textView>
</subviews>
<color key="backgroundColor" red="0.45138680930000002" green="0.99309605359999997" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="bottom" relation="greaterThanOrEqual" secondItem="S6g-U0-TeD" secondAttribute="bottom" constant="8" id="Ewc-yq-KHO"/>
<constraint firstItem="S6g-U0-TeD" firstAttribute="leading" secondItem="zW5-KI-gna" secondAttribute="leading" constant="8" id="RIE-gD-bX2"/>
<constraint firstAttribute="trailing" secondItem="S6g-U0-TeD" secondAttribute="trailing" constant="8" id="SfV-e8-TXV"/>
<constraint firstItem="S6g-U0-TeD" firstAttribute="top" relation="greaterThanOrEqual" secondItem="zW5-KI-gna" secondAttribute="top" constant="8" id="byT-nx-8K1"/>
<constraint firstItem="S6g-U0-TeD" firstAttribute="centerY" secondItem="zW5-KI-gna" secondAttribute="centerY" id="qGs-hb-AdH"/>
</constraints>
</view>
</subviews>
<color key="backgroundColor" red="1" green="0.83234566450000003" blue="0.47320586440000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
<constraints>
<constraint firstAttribute="bottom" secondItem="zW5-KI-gna" secondAttribute="bottom" constant="8" id="1xU-wS-Qcb"/>
<constraint firstItem="zW5-KI-gna" firstAttribute="top" secondItem="guO-HM-qxH" secondAttribute="top" constant="8" id="CgB-kT-vjH"/>
<constraint firstItem="zW5-KI-gna" firstAttribute="leading" secondItem="guO-HM-qxH" secondAttribute="leading" constant="8" id="O4I-aF-PEV"/>
<constraint firstAttribute="height" constant="240" id="OZD-dD-yht"/>
<constraint firstAttribute="trailing" secondItem="zW5-KI-gna" secondAttribute="trailing" constant="8" id="QXI-Lh-37A"/>
<constraint firstItem="zW5-KI-gna" firstAttribute="height" secondItem="guO-HM-qxH" secondAttribute="height" priority="250" constant="-16" id="dMe-rS-ZOO"/>
<constraint firstItem="zW5-KI-gna" firstAttribute="width" secondItem="guO-HM-qxH" secondAttribute="width" constant="-16" id="pGF-wL-V4q"/>
</constraints>
</scrollView>
</subviews>
<color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
<constraints>
<constraint firstItem="XpO-5d-W48" firstAttribute="trailing" secondItem="guO-HM-qxH" secondAttribute="trailing" constant="20" id="Mvu-Ug-NEY"/>
<constraint firstItem="guO-HM-qxH" firstAttribute="leading" secondItem="XpO-5d-W48" secondAttribute="leading" constant="20" id="Rfe-Ev-3xj"/>
<constraint firstItem="guO-HM-qxH" firstAttribute="top" secondItem="XpO-5d-W48" secondAttribute="top" constant="80" id="YhH-mc-af6"/>
</constraints>
<viewLayoutGuide key="safeArea" id="XpO-5d-W48"/>
</view>
</viewController>
<placeholder placeholderIdentifier="IBFirstResponder" id="p5Q-GK-BKG" userLabel="First Responder" sceneMemberID="firstResponder"/>
</objects>
<point key="canvasLocation" x="-10" y="775"/>
</scene>
</scenes>
</document>
【讨论】：
感谢您的详细回复。这可能适用于示例场景，但我的场景太复杂了。我已经有滚动视图等。我的约束也类似于你对 UITextView 的建议。它仍然对我不起作用。这可能是因为我在 UITextView 中使用的属性文本【参考方案2】：请检查此link 以了解中心文本对齐方式。
textView.textAlignment = .center
【讨论】：
这会水平对齐文本，请在回答前阅读问题以上是关于如何在 UITextView 中垂直对齐文本的主要内容，如果未能解决你的问题，请参考以下文章
如何在 React Native 的文本输入中垂直对齐文本？