Question

我想用XIB实现自定义UITableViewCell。 Here是图纸。 主视图右侧的按钮显示/隐藏附加视图。我有两个问题：

如何隐藏其他视图？我认为一种可能性是将额外UIView的帧中的高度设置为零。还有更好的选择吗？
附加视图中的按钮（在本例中为1-5）应该是动态显示的。有两组数据：一组用于左侧（按钮1-3），另一组用于右侧（按钮4-5）。左按钮的高度是固定的，让我们说每个70px。应调整右侧按钮的高度，使右侧按钮的总高度与左侧的总高度相同。如何根据这些规则动态添加按钮？

将在运行时添加按钮。例如，有两个数组：

var leftButtons:[String] = ["button1label", “button2label“, "button3label"]

var rightButtons:[String] = ["button4label", "button5label"]。

假设我在运行期间稍后在上将"button6label"添加到leftButtons。应调整leftView / rightView的大小以及这些视图中按钮的大小。同样，左手尺寸上每个按钮的高度都是固定的。

Answer 1

首先，您应该在自定义UITableViewCell上添加ContainerView视图，现在为所有约束添加ContainerView - leading , trailing, top & bottom to superView priority 999的约束。

现在您应该在ContainerView上添加两个视图，一个是mainView，另一个是additionView。

并在mainView上添加约束 - 导致superView，top到superView，跟踪到superView和高度约束（比方说70）。

现在在mainView中添加textfield和show/hide button，并在textField和show/hide button上应用约束。

textField约束 - leading to superView，top to superView，bottom to superView和Horizontal spacing between textField & show/hide button。

显示/隐藏按钮约束 - top to superView，bottom to superView，trailing to superView和宽度限制。

此处mainView已正确配置。现在让我们配置additionView

您应该在additionView中添加两个新视图，一个是leftView，另一个是rightView＆amp; add constraints上的leftView & rightView。

leftView约束 - leading to superView，top to superView，bottom to superView，Horizontal spacing between leftView & rightView， equal width and width constraints of leftView to rightView。

rightView约束 - trailing to superView，top to superView＆amp; bottom to superView 在这里你的Interface Builder Designing completed所以现在我们需要在运行时管理左右View上的按钮。要做到这一点，你必须使一个名为VerticalContainerView的客户类管理按钮垂直分布。

我使用KVConstraintExtensionsMaster库创建了 VerticalContainerView ，以应用我已实施的约束。

将以下代码放在VerticalContainerView.h标题文件

中

#import <UIKit/UIKit.h>

@interface VerticalContainerView : UIView
-(void)configureButtonsbyNames:(NSArray<__kindof NSString *>*)names isDistribuated:(BOOL)isDistributed;
@end

将以下代码放在VerticalContainerView.m文件

中

#import "VerticalContainerView.h"
#import "KVConstraintExtensionsMaster.h"

@implementation VerticalContainerView

-(void)configureButtonsbyNames:(NSArray<__kindof NSString *>*)names isDistribuated:(BOOL)isDistributed
{
    /* Just Two steps to Apply\Add constraints by programatically */
    /* Step 1 create & configure the view hierarchy for constraint first. */
    /* Step 2 Apply the constraints */

    CGFloat space  = 0.0;
    CGFloat height = 70.0;

    UIButton *previousContentButton = nil;
    NSInteger count  = names.count;

    for (NSInteger i = 0; i < count; i++)
    {
        UIButton *contentButton = [UIButton prepareNewViewForAutoLayout];
        if (i&1) {
            [contentButton setBackgroundColor:[UIColor greenColor]];
        }else{
            [contentButton setBackgroundColor:[UIColor purpleColor]];
        }

        [contentButton setTag:i];
        [contentButton setTitle:names[i] forState:UIControlStateNormal];
        [self addSubview:contentButton];

        [contentButton applyLeadingAndTrailingPinConstraintToSuperviewWithPadding:space];

        if (!isDistributed) {
            [contentButton applyHeightConstraint:height];
        }

        if (i == 0) // for first
        {
            [contentButton applyTopPinConstraintToSuperviewWithPadding:space];
        }
        else if (i == count-1) // for last
        {
            if (isDistributed) {
                [previousContentButton applyConstraintFromSiblingViewAttribute:NSLayoutAttributeHeight toAttribute:NSLayoutAttributeHeight ofView:contentButton spacing:space];
            }

            [previousContentButton applyConstraintFromSiblingViewAttribute:NSLayoutAttributeBottom toAttribute:NSLayoutAttributeTop ofView:contentButton spacing:space];
            [contentButton applyBottomPinConstraintToSuperviewWithPadding:space];
        }
        else
        {
            if (isDistributed) {
                [previousContentButton applyConstraintFromSiblingViewAttribute:NSLayoutAttributeHeight toAttribute:NSLayoutAttributeHeight ofView:contentButton spacing:space];
            }

            [previousContentButton applyConstraintFromSiblingViewAttribute:NSLayoutAttributeBottom toAttribute:NSLayoutAttributeTop ofView:contentButton spacing:space];
        }

        previousContentButton = contentButton;
    }

}

@end

现在创建一个名为CustomCell的自定义单元格＆amp;将下面的代码放在CustomCell.h头文件

中

#import "VerticalContainerView.h"

@interface CustomCell : UITableViewCell
@property (weak, nonatomic) IBOutlet VerticalContainerView *leftVerticalContainerView;
@property (weak, nonatomic) IBOutlet VerticalContainerView *rightVerticalContainerView;
@end

将以下代码放在CustomCell.m文件中。

#import "CustomCell.h"

@implementation CustomCell

-(void)prepareForReuse
{
    // here you have to remove the all the buttons from left and right veiw becuase
    // Every cell can have distinct number buttons on left and right view.

    for (UIView *subView in self.leftVerticalContainerView.subviews) {
        [subView removeFromSuperview];
    }
    for (UIView *subView in self.leftVerticalContainerView.subviews) {
        [subView removeFromSuperview];
    }

    [super prepareForReuse];

}

@end

现在，在UITableViewCell Class Identity inspector editor

的Interface Builder的帮助下，我们的CustomCell更改了left and right View Class

在[{1}} VerticalContainerView

的Identity inspector editor的帮助下，我们的Interface Builder也会更改IBOutlet

现在连接我们的leftVerticalContainerView & rightVerticalContainerView CusromCell tableView.rowHeight = UITableViewAutomaticDimension; /* any estimated height but must be more than 2, but it should be more estimated */ tableView.estimatedRowHeight = 210.0; tableView.delegate = self; tableView.dataSource = self; // if you created cell from `.xib` is called CustomCell.xib,then you have to register that cell with table. // UINib *nib = [UINib nibWithNibName:@"CustomCell" bundle:nil]; // [tableView registerNib:nib forCellReuseIdentifier:@"YouCellIdentifier"];

将以下代码放在ViewController的viewDidLoad方法中：

UITableView DataSource

现在在ViewController中实现- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection: (NSInteger)section{ return 10; } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath: (NSIndexPath *)indexPath{ static NSString *cellIdentifier = @"CustomCell"; CustomCell *cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier forIndexPath:indexPath]; if (indexPath.row%2 == 0) { // this is fixed height constraints [cell.leftVerticalContainerView configureButtonsbyNames:@[@"button1",@"button2",@"button3"] isDistributed:NO]; // this is distributed height constraints according to left view [cell.rightVerticalContainerView configureButtonsbyNames:@[@"button4",@"button5"] isDistributed:YES]; } else{ // this is fixed height constraints [cell.leftVerticalContainerView configureButtonsbyNames:@[@"button1",@"button2",@"button3",@"button4",@"button5"] isDistributed:NO]; // this is isDistribuated height constraints according to left view [cell.rightVerticalContainerView configureButtonsbyNames:@[@"button6",@"button7",@"button8"] isDistributed:YES]; } return cell; }

<div id = "bgSound">
  <iframe id = 'first' width="0" height="0" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https://api.soundcloud.com/tracks/257485031?secret_token=s-i9opu&color=ff5500&inverse=false&auto_play=false&show_user=true"></iframe>

  <iframe id = "second" width="0" height="0" scrolling="no" frameborder="no" src="https://api.soundcloud.com/tracks/257498359?secret_token=s-c9D5D&auto_play=false&hide_related=false&show_comments=true&show_user=true&show_reposts=false&visual=true"></iframe>
</div>

Answer 2

您可以使用具有自动高度的UITableViewCell来执行此操作。这允许您使用约束来确定单元格的高度。

要实现这个目标：

添加以下行以启用自动高度：

tableView.rowHeight = UITableViewAutomaticDimension tableView.estimatedRowHeight = 160.0 //一个近似的单元格高度。
使用约束使单元格的内容向外推送，以便内容确定单元格高度。
在代码中使用IBOutlet向附加视图添加高度约束。将此约束的constant属性设置为0，并将其他视图的.hidden属性设置为true以隐藏其他视图。
为了更好的打开/关闭，更改constant动画块内的约束UIView属性。

自定义UITableViewCell，在Swift中有下拉列表

2 个答案: