时间戳

首页 > 解决方案 > 如何为自定义单元格中的动态附加输入字段添加约束

ios - 如何为自定义单元格中的动态附加输入字段添加约束

问题描述

如何在自定义表格单元格中添加动态输入字段时实现单元格的动态高度

- (IBAction)clickButtonAdd:(id)sender {
    NSLog(@"test chekboc");
    CGFloat y ;
    CGFloat x ;
    UITextField *textField = nil;
       textField.frame = CGRectMake(x, y,100,30);
       textField = [[UITextField alloc]initWithFrame:CGRectMake(x,y,100,30)];
       textField.borderStyle = UITextBorderStyleRoundedRect;
      [self.contentView addSubview:textField];
     NSLog(@"x value :: %f",x);
}

使用上面的代码，我可以附加动态输入字段。但是每当我们添加一个新的输入字段时，单元格高度不会动态增加。

更新 单元约束

这些是动态附加到 tableview 中的自定义 tableviewcells，在第一个附加单元格中包含一个动态添加的文本字段。而第二个代表初始单元格 GUI。问题是对齐新添加的输入字段并分别增加单元格高度

标签： iosobjective-ciphone

解决方案

添加“垂直堆栈”视图（例如文本字段）的一个好方法是使用UIStackView. 设置约束，使堆栈视图的底部控制单元格的底部。随着每个新字段添加到堆栈视图，它会自动增加高度。

这是一个示例布局（我试图匹配您的图像）：

在此处输入图像描述

两个重要的键...

  • 给堆栈视图一个Height约束，以便您可以在设计时看到它。但是...编辑该约束并选择Placeholder / Remove at build time. 这样，当它没有排列的子视图时，它的高度为零，并且在添加视图时不会阻止它展开。
  • 将Priority底部约束设置为999。虽然不是绝对必要的，但它可以防止约束冲突警告，因为自动布局会多次通过以确定完整布局。

关于设计的其他几点说明：

  • Priority: 999如果您将单元格拉伸得比实际需要的高一点，通过将底部约束设置为您将不会收到 IB 警告。
  • 为避免标签垂直拉伸，请将其垂直Content Hugging Priority: 1000
  • 如果您仔细查看我设置的约束，您会发现一些元素约束是相互关联的，而不是与显式常量相关的。例如：
    • “设置日期范围”标签垂直居中在“日期选择器”上，“范围按钮”垂直居中在标签上。
    • “必填”标签垂直居中于“必填按钮”，与“范围按钮”垂直隔开
    • 如果您调整任何间距，这将有助于保持元素对齐

这是 .xib 的源代码，因此您可以更仔细地检查约束：

<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="15505" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" useSafeAreas="YES" colorMatched="YES">
    <device id="retina6_1" orientation="portrait" appearance="light"/>
    <dependencies>
        <deployment identifier="iOS"/>
        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="15510"/>
        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
    </dependencies>
    <objects>
        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
        <tableViewCell clipsSubviews="YES" contentMode="scaleToFill" preservesSuperviewLayoutMargins="YES" selectionStyle="default" indentationWidth="10" rowHeight="166" id="PJb-fG-tbA">
            <rect key="frame" x="0.0" y="0.0" width="414" height="166"/>
            <autoresizingMask key="autoresizingMask"/>
            <tableViewCellContentView key="contentView" opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" preservesSuperviewLayoutMargins="YES" insetsLayoutMarginsFromSafeArea="NO" tableViewCell="PJb-fG-tbA" id="kHE-Zl-zZn">
                <rect key="frame" x="0.0" y="0.0" width="414" height="166"/>
                <autoresizingMask key="autoresizingMask"/>
                <subviews>
                    <textField opaque="NO" contentMode="scaleToFill" verticalHuggingPriority="1000" contentHorizontalAlignment="left" contentVerticalAlignment="center" borderStyle="roundedRect" placeholder="Question" textAlignment="natural" minimumFontSize="17" translatesAutoresizingMaskIntoConstraints="NO" id="edU-F7-Rfh">
                        <rect key="frame" x="10" y="10" width="395" height="34"/>
                        <fontDescription key="fontDescription" type="system" pointSize="14"/>
                        <textInputTraits key="textInputTraits"/>
                    </textField>
                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="1000" text="Date Picker" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="UGi-vq-LEE">
                        <rect key="frame" x="10" y="57" width="180" height="21"/>
                        <constraints>
                            <constraint firstAttribute="width" constant="180" id="H3h-PK-Tn5"/>
                        </constraints>
                        <fontDescription key="fontDescription" type="system" pointSize="17"/>
                        <nil key="textColor"/>
                        <nil key="highlightedColor"/>
                    </label>
                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Set Date Range" textAlignment="right" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="J4r-by-M6A">
                        <rect key="frame" x="251" y="57" width="119" height="21"/>
                        <fontDescription key="fontDescription" type="system" pointSize="17"/>
                        <nil key="textColor"/>
                        <nil key="highlightedColor"/>
                    </label>
                    <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="RBZ-hT-7ef" userLabel="RangeButton">
                        <rect key="frame" x="378" y="55" width="25" height="25"/>
                        <color key="backgroundColor" red="0.83741801979999997" green="0.83743780850000005" blue="0.83742713930000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                        <constraints>
                            <constraint firstAttribute="width" constant="25" id="7aP-lC-w89"/>
                            <constraint firstAttribute="width" secondItem="RBZ-hT-7ef" secondAttribute="height" multiplier="1:1" id="wgb-Ok-OF2"/>
                        </constraints>
                    </button>
                    <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Required" textAlignment="right" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="JQn-il-RKW">
                        <rect key="frame" x="301" y="93" width="69" height="21"/>
                        <fontDescription key="fontDescription" type="system" pointSize="17"/>
                        <nil key="textColor"/>
                        <nil key="highlightedColor"/>
                    </label>
                    <button opaque="NO" contentMode="scaleToFill" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="qmA-hD-Bry" userLabel="RequiredButton">
                        <rect key="frame" x="378" y="91" width="25" height="25"/>
                        <color key="backgroundColor" red="0.83741801979999997" green="0.83743780850000005" blue="0.83742713930000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                        <constraints>
                            <constraint firstAttribute="width" constant="25" id="YBm-hg-3dr"/>
                            <constraint firstAttribute="width" secondItem="qmA-hD-Bry" secondAttribute="height" multiplier="1:1" id="u7w-4a-ue5"/>
                        </constraints>
                    </button>
                    <button opaque="NO" contentMode="scaleToFill" verticalHuggingPriority="1000" contentHorizontalAlignment="center" contentVerticalAlignment="center" buttonType="roundedRect" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="YJ4-1K-hxl" userLabel="TrashButton">
                        <rect key="frame" x="16" y="89" width="24" height="24"/>
                        <color key="backgroundColor" red="0.92003184559999995" green="0.73834878130000003" blue="0.71511208169999996" alpha="1" colorSpace="custom" customColorSpace="displayP3"/>
                        <constraints>
                            <constraint firstAttribute="width" secondItem="YJ4-1K-hxl" secondAttribute="height" multiplier="1:1" id="djU-d0-anS"/>
                            <constraint firstAttribute="width" constant="24" id="soO-f2-V8B"/>
                        </constraints>
                    </button>
                    <stackView opaque="NO" contentMode="scaleToFill" axis="vertical" spacing="11" translatesAutoresizingMaskIntoConstraints="NO" id="Gg8-ZU-spe" userLabel="FieldHolderStackView">
                        <rect key="frame" x="10" y="124" width="100" height="30"/>
                        <constraints>
                            <constraint firstAttribute="height" constant="30" placeholder="YES" id="iYY-1E-iFe"/>
                            <constraint firstAttribute="width" constant="100" id="w6c-FN-Qk0"/>
                        </constraints>
                    </stackView>
                </subviews>
                <constraints>
                    <constraint firstAttribute="bottom" secondItem="Gg8-ZU-spe" secondAttribute="bottom" priority="999" constant="10" id="0I5-0k-03U"/>
                    <constraint firstItem="qmA-hD-Bry" firstAttribute="top" secondItem="RBZ-hT-7ef" secondAttribute="bottom" constant="11" id="1P1-gw-Cwp"/>
                    <constraint firstItem="RBZ-hT-7ef" firstAttribute="leading" secondItem="J4r-by-M6A" secondAttribute="trailing" constant="8" id="2Ao-ZT-eIv"/>
                    <constraint firstItem="YJ4-1K-hxl" firstAttribute="top" secondItem="UGi-vq-LEE" secondAttribute="bottom" constant="11" id="6hR-g2-Ihn"/>
                    <constraint firstItem="UGi-vq-LEE" firstAttribute="leading" secondItem="kHE-Zl-zZn" secondAttribute="leading" constant="10" id="9CW-cL-yiq"/>
                    <constraint firstItem="RBZ-hT-7ef" firstAttribute="centerY" secondItem="J4r-by-M6A" secondAttribute="centerY" id="BBF-sa-WsF"/>
                    <constraint firstItem="Gg8-ZU-spe" firstAttribute="top" secondItem="YJ4-1K-hxl" secondAttribute="bottom" constant="11" id="FWT-S5-XZB"/>
                    <constraint firstAttribute="trailing" secondItem="RBZ-hT-7ef" secondAttribute="trailing" constant="11" id="GIW-p6-CgM"/>
                    <constraint firstAttribute="trailing" secondItem="edU-F7-Rfh" secondAttribute="trailing" constant="9" id="M5u-uX-qfk"/>
                    <constraint firstItem="UGi-vq-LEE" firstAttribute="top" secondItem="edU-F7-Rfh" secondAttribute="bottom" constant="13" id="Npo-gd-sot"/>
                    <constraint firstItem="edU-F7-Rfh" firstAttribute="top" secondItem="kHE-Zl-zZn" secondAttribute="top" constant="10" id="OT2-CJ-5fh"/>
                    <constraint firstItem="edU-F7-Rfh" firstAttribute="leading" secondItem="kHE-Zl-zZn" secondAttribute="leading" constant="10" id="UUv-RU-c4W"/>
                    <constraint firstAttribute="trailing" secondItem="qmA-hD-Bry" secondAttribute="trailing" constant="11" id="VdG-Gt-Q0N"/>
                    <constraint firstItem="JQn-il-RKW" firstAttribute="centerY" secondItem="qmA-hD-Bry" secondAttribute="centerY" id="Wu6-Sf-34N"/>
                    <constraint firstItem="qmA-hD-Bry" firstAttribute="leading" secondItem="JQn-il-RKW" secondAttribute="trailing" constant="8" id="ZlM-6u-Tsh"/>
                    <constraint firstItem="Gg8-ZU-spe" firstAttribute="leading" secondItem="kHE-Zl-zZn" secondAttribute="leading" constant="10" id="aQy-xo-rYY"/>
                    <constraint firstItem="J4r-by-M6A" firstAttribute="centerY" secondItem="UGi-vq-LEE" secondAttribute="centerY" id="eVE-sv-0Cf"/>
                    <constraint firstItem="YJ4-1K-hxl" firstAttribute="leading" secondItem="kHE-Zl-zZn" secondAttribute="leading" constant="16" id="gdo-Xv-dBt"/>
                </constraints>
            </tableViewCellContentView>
            <point key="canvasLocation" x="113.04347826086958" y="175.44642857142856"/>
        </tableViewCell>
    </objects>
</document>

推荐阅读