I have a tableview cell and im using the UIAutomaticDimensions functionality to make sure the tableview cell can size itself. The cell has 3 labels and an imageview as its contents. Now the problem is with the labels and their vertical constraints. unless there is text in the label the label will not show. It just overwrites the previous position of the label on top of it and makes the cell very very small. What i want to be able to do is always display all three labels so the height of the cell is always the same as another cell.
How can i achieve showing the label even if there is no text in the label?
Heres an explination of the contents constraints.
[self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:_prospect_avatar
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:self.contentView
attribute:NSLayoutAttributeLeading
multiplier:1.0
constant:0.0f]];
[self.contentView addConstraint:[NSLayoutConstraint constraintWithItem:_prospect_avatar
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:self.contentView
attribute:NSLayoutAttributeLeading
multiplier:1.0f
constant:100.0f]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|[_prospect_avatar]|"
options:0
metrics:nil
views:NSDictionaryOfVariableBindings(_prospect_avatar)]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:[_prospect_avatar][_full_name_label]-|"
options:NSLayoutFormatDirectionLeadingToTrailing
metrics:nil
views:NSDictionaryOfVariableBindings(_prospect_avatar,_full_name_label)]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:[_prospect_avatar][_phone_number_label]-|"
options:NSLayoutFormatDirectionLeadingToTrailing
metrics:nil
views:NSDictionaryOfVariableBindings(_prospect_avatar,_phone_number_label)]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"H:[_prospect_avatar][_email_label]-|"
options:NSLayoutFormatDirectionLeadingToTrailing
metrics:nil
views:NSDictionaryOfVariableBindings(_prospect_avatar,_email_label)]];
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|-10-[_full_name_label][_email_label][_phone_number_label]-10-|"
options:NSLayoutFormatAlignAllLeading
metrics:nil
views:NSDictionaryOfVariableBindings(_full_name_label,_email_label,_phone_number_label)]];
Mahesh Agrawala has the correct answer. In the vertical constraints for eah of the labels i have to add a greater than or less than value for the labels height. So for example what i previously had set for the constraints was
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|-10-[_full_name_label][_email_label][_phone_number_label]-10-|"
options:NSLayoutFormatAlignAllLeading
metrics:nil
views:NSDictionaryOfVariableBindings(_full_name_label,_email_label,_phone_number_label)]];
WHen really the constraint should have looked like
[self.contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:#"V:|-10-[_full_name_label(>=20)][_email_label(>=20)][_phone_number_label(>=20)]-10-|"
options:NSLayoutFormatAlignAllLeading
metrics:nil
views:NSDictionaryOfVariableBindings(_full_name_label,_email_label,_phone_number_label)]];
If you look at my new constraints at the end of each label in the constraint i have added (>=20) right before the trailing ] this tells autolayout that i at least want this label to 20 points or greater in height
There are numerous other ways to do this so this is not the only way to accomplish my task but in this circumstance it was the quickest.
Related
I am creating a table with expandable rows in JavaFX based on this example:
http://codemonkeycorner.com/post/expandable-table-rows-in-javafx
I am also adding a CheckBoxTableCell in the simplest possible manner:
TableColumn<Person, Boolean> checkBoxCol = new TableColumn<>("check");
checkBoxCol.setCellFactory(CheckBoxTableCell.forTableColumn(itemId -> {
BooleanProperty visibleProperty = new SimpleBooleanProperty();
return visibleProperty;
}));
table.getColumns().addAll(expandCol, firstNameCol, lastNameCol, emailCol, checkBoxCol);
This works well for adding the CheckBoxes, however when I expand the table rows the checkbox will be vertically aligned to the center of the expanded row instead of stying at the top which is the behavior of the text cells.
Is there a way to change this behavior using CSS or Java code? How can I set the vertical alignment of the CheckBox within the CheckBoxTableCell?
I found a solution, setting
-fx-alignment: top-center;
in CSS worked.
You can apply in the CSS for the checkbox element cell the property "vertical-align:middle;"
I'm new to qt and exploring it .I want to have a text which is center aligned in my Mainwindow's toolbar.Below is my code inside my MainWindow constructor:
QLabel* label=new QLabel("Hello World");
label->setAlignment(Qt::AlignHCenter);
QHBoxLayout *layout = new QHBoxLayout();
layout->addWidget(label);
QWidget* wid = new QWidget;
wid->setLayout(layout);
ui->mainToolBar->addWidget(wid);
The above code displays the text , but not at the center.It displays at the left.What am I missing?Any help will be really helpful.
label->setAlignment(Qt::AlignHCenter);
This tells the label to (horizontally) center the text in itself.
layout->addWidget(label);
This is expanded by default argument to
layout->addWidget(label, 0);
Where the 0 is the stretch factor of the label within this layout. Zero means your label will be given as much space as it needs to display properly but nothing more. So your label is just as big as your text needs, has it's text centered, but since it's on a QHBoxLayout it's shown on the left side within your bar. If there are no other widgets in your bar's layout, you can set the stretch-factor to 1 to make the label fill the layout, your text will then show in the center.
layout->addWidget(label, 1);
I have some problem setting margin on some view inside uiscrollview, I create via IB a scrollview and 3 view (they are outside of self.view), in my app I add this view with:
[scrollview addsubview:view1], eccc
after this I add constrains in this way:
[_ingredienti setTranslatesAutoresizingMaskIntoConstraints:NO];
[_scrollView addSubview:_ingredienti];
[_scrollView addConstraint:[NSLayoutConstraint constraintWithItem:_ingredienti
attribute:NSLayoutAttributeHeight
relatedBy:NSLayoutRelationEqual
toItem:_scrollView
attribute:NSLayoutAttributeHeight
multiplier:1
constant:0]];
[_scrollView addConstraint:[NSLayoutConstraint constraintWithItem:_ingredienti
attribute:NSLayoutAttributeWidth
relatedBy:NSLayoutRelationEqual
toItem:_scrollView
attribute:NSLayoutAttributeWidth
multiplier:1
constant:0]];
[_scrollView addConstraint:[NSLayoutConstraint constraintWithItem:_ingredienti
attribute:NSLayoutAttributeLeftMargin
relatedBy:NSLayoutRelationEqual
toItem:_scrollView
attribute:NSLayoutAttributeLeft
multiplier:1
constant:self.scrollView.frame.size.width * 2]];
this for all 3 views, obviously NSLayoutAttributeLeftMargin has 3 different value, 0, self.scrollView.frame.size.width and 2 * self.scrollView.frame.size.width, the problem is that the margin is wrong, is some pixel less then self.scrollView.frame.size.width, where is the mistake?
It appears that there are no constraints linking the _ingredienti top, bottom or right position to the _scrollview, which it needs to size its contentview. See the "Pure Autolayout" subsection of Technical Note TN2154: UIScrollView And Autolayout
I have a UIViewController with a UITableView as well as a UIView that is above the UITableView but aligned to the bottom of the screen. Problem is when the user is on a phone call, the frame settings don't work, and the UIView is pushed below the screen (so it is slightly covered. I'm trying to just align the UIView to the view bottom and simply not getting it to align. I have the constraints defined as below:
[self.view addSubview:self.signupView];
[self.view addSubview:self.tableView];
[self.view bringSubviewToFront:self.signupView];
NSArray *v = [NSLayoutConstraint constraintsWithVisualFormat:#"V:|[_signupView(70)]-0-|"
options:NSLayoutFormatAlignAllBaseline
metrics:nil
views:NSDictionaryOfVariableBindings(_signupView)];
NSArray *h = [NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_signupView]|"
options:NSLayoutFormatAlignAllBottom
metrics:nil
views:NSDictionaryOfVariableBindings(_signupView)];
[self.view addConstraints:h];
[self.view addConstraints:v];
The height of signupView is 70, and it should just be aligned at the bottom of the screen with the width of the entire screen. The above code is putting the view at the top of the view. Is there something i'm missing here? Why is it not aligning with the bottom as I put above? I tried to read the below on this:
http://commandshift.co.uk/blog/2013/01/31/visual-format-language-for-autolayout/
http://makeapppie.com/2014/07/26/the-swift-swift-tutorial-how-to-use-uiviews-with-auto-layout-programmatically/
Use autolayout to set dynamic UIView to match container view
Figured it out.
Here is the below that worked for me:
NSArray *v = [NSLayoutConstraint constraintsWithVisualFormat:#"V:[_signupView(70)]-0-|"
options:NSLayoutFormatAlignAllBaseline
metrics:nil
views:NSDictionaryOfVariableBindings(_signupView)];
NSArray *h = [NSLayoutConstraint constraintsWithVisualFormat:#"H:|[_signupView]|"
options:NSLayoutFormatAlignAllBottom
metrics:nil
views:NSDictionaryOfVariableBindings(_signupView)];
[self.view addConstraints:h];
[self.view addConstraints:v];
I would like to make numbers of uiview in the center of the red area.
How could I do that with NSAutolayout ? Even when users rotate?
landscape mode
top
....................................
- view - ... 200px margin from right
| gap
- view -
| gap
- view -
| gap
- view -
....................................
bottom
Your question isn't really clear.
You can create constraints to center a view with respect to another view in a given orientation. For example, you can set one view's "centerX" attribute to equal some other view's centerX. (You could also make it equal that other view's leading, trailing, left, or right edge. Or even other attributes that don't make much intuitive sense, like width, top, etc., if that's what you want.)
If you're trying to vertically center a group like the stack of views in your diagram, there are a couple of approaches. First, you can embed the group into another view that closely encloses it. Its top would equal the top of the first view in the stack and its bottom would equal the bottom of the last view in the stack. Then you could set up a constraint to keep that container view centered within its superview.
The other approach is to create hidden spacer views. Put one view, the top spacer, above the first view in your stack. Make its top equal the top of the superview. Make its bottom equal the top of the first view in your stack. Similarly, set up a spacer at the bottom. Its top would equal the bottom of the last view in your stack. Its bottom would equal the bottom of the superview. Then, set a constraint between the top spacer and the bottom spacer to make their heights equal. That ensures that the space between the stack and the superview is the same on the top and the bottom.
The same techniques work for the horizontal direction, too, if necessary.
Update:
Here's some code which I haven't tested at all:
UIView* redArea = /* ... */;
NSArray* stackViews = /* ... */;
UIView* container = [[UIView alloc] initWithFrame:NSZeroRect];
[redArea addSubview:container];
UIView* previousView = nil;
for (UIView* view in stackViews)
{
[container addSubview:view];
if (previousView)
{
// Make a gap between the stacked views
NSDictionary* views = NSDictionaryOfVariableBindings(view, previousView);
NSArray* constraints = [NSLayoutConstraint constraintsWithVisualFormat:#"V:[previousView]-[view]" options:0 metrics:nil views:views];
[container addConstaints:constraints];
}
else
{
// Make the top of the container the same as the top of the first stacked view
NSDictionary* views = NSDictionaryOfVariableBindings(view);
NSArray* constraints = [NSLayoutConstraint constraintsWithVisualFormat:#"V:|[view]" options:0 metrics:nil views:views];
[container addConstaints:constraints];
}
// Make sure the container is at least as wide as each stacked view
NSDictionary* views = NSDictionaryOfVariableBindings(view);
NSArray* constraints = [NSLayoutConstraint constraintsWithVisualFormat:#"H:|-(>=0)-[view]-(>=0)-|" options:0 metrics:nil views:views];
[container addConstaints:constraints];
previousView = view;
}
if (previousView)
{
// Make the bottom of the container the same as the bottom of the last stacked view
NSDictionary* views = NSDictionaryOfVariableBindings(previousView);
NSArray* constraints = [NSLayoutConstraint constraintsWithVisualFormat:#"V:[previousView]|" options:0 metrics:nil views:views];
[container addConstaints:constraints];
}
// Make the container as narrow as possible after satisfying other constraints
NSLayoutConstraint* minimalWidth = [NSLayoutConstraint constraintWithItem:container attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:0];
minimalWidth.priority = UILayoutPriorityFittingSizeLevel - 1;
[container addConstraint:minimalWidth];
// Center the container within the red area
NSLayoutConstraint* centerVertically = [NSLayoutConstraint constraintWithItem:container attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:redArea attribute:NSLayoutAttributeCenterY multiplier:1 constant:0];
NSLayoutConstraint* centerHorizontally = [NSLayoutConstraint constraintWithItem:container attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:redArea attribute:NSLayoutAttributeCenterX multiplier:1 constant:0];
[redArea addConstraints:#[centerVertically, centerHorizontally]];
This would all be easier to set up in IB.