Show / Not show storyboard image in code while adjusting constraints - ios

So, I have the following setup in storyboard:
storyboard image showing the setup
The code is setup so that that image is an optional. As it stands, when the object passed to this view controller doesn't have an image in it, the image becomes hidden. The problem is the gap that remains between paragraph1 and paragraph2. I want to have it so that if the image isn't in the object being passed to this viewController, then paragraph1 and paragraph2 come close to each other.
If you need any more info about the setup, I'm all ears(well, eyes, but hey...) Any direction would help. Thanks.

In your cell subclass, add an outlet to the UIImageView height constraint. When you configure the cell, e.g. in tableView:cellForRowAtIndexPath:, check if the image is nil, like this:
if let _ = cell.myImageView.image {
cell.imageViewHeightConstraint.constant = xx // put your image height here
} else {
cell.imageViewHeightConstraint.constant = 0 // give the imageView a height of 0
}

Related

How to centeralize a label after hiding an image next to it

I have a custom cell that has an image and a label in it next to each other. I am reusing the custom cell in another place but I have a condition that hides the image.
How do I set the label to be centered after hiding the image?
I tried to set the text alignment to center but it didn't work.
if (condition) == false{
self.checkImage.isHidden = true
}
else {
self.checkImage.isHidden = false
}
An easy option is to put both the imageView and the label inside a horizontal stackView which will make the label centered when you set isHidden to the imageView
Or
Make an outlet of the imageView width and set it's constant to zero

UICollectionViewCell with a dynamic image dimensions - As u scroll, the image loses its initial constraints when the cell is re-used TestApp attached

I would like some assistance please.
I have a UICollectionViewCell for an onBoarding scenario each cell contains one image with different dimensions that are set dynamically.
I am using WWLayout similar to SnapKit to handle the constrains.
The issue is when I swipe thru and the cell is re-used the constraints break and the image loses its initial dimensions.
I have attached a TestApp.
https://www.dropbox.com/s/tx141lpr0uzlhbx/Test%20App.Image.Resize.zip?dl=0
Thank you.
In OnBoardingItemView.swift, function layoutUI(), just before you layout imageView, try adding this line:
imageView.removeConstraints(imageView.constraints)
The image was not being scaled properly. Update your code with this one to prevent the image from stretching.
private lazy var imageView: UIImageView = {
let imageView = UIImageView()
imageView.contentMode = .scaleAspectFit
return imageView
}()
This variable is in OnBoardingItemView.swift, line 35

Remove an uiimageview from storyboard completely?

I have a table and a cell with a text and image. i want to remove the imageview completely from the cell because the cells are dynamically generated and some have images and some dont.
i have tried:
imageview.hidden = true
and i also tried:
imageview.removeFromSuperview()
but those remove the image but not the image view. right now, when there is no image, the image does not show up in the imageview but there is a huge gap below the text with no image because it seems like the imageview is still there. i want to remove the imageview completely so the huge gap is not there for cells with no images.
It's important that cells were reused. Don't remove because you didn't add it back. And if you hide image view, you should show it when this was needed. Like this:
if needed {
imageview.hidden = false
} else {
imageview.hidden = true
}
Using Autolayout you can solve this problem. Dont give fixed height and fixed width. And check content hugging/compression priority of imageview is properly set or not.

How to add many UIImageViews inside ScrollView?

I will have about 12+ (any multiple of 4 per row) images that I want to have inside a ScrollView. See example below, the 12 circles (with the last row cut off a bit) are the UIImageViews.
I am not able to add the UIImageViews inside the ScrollView. The width,height of the scrollView is 250,250
This is what I have tried:
func setScrollView() {
scrollView_avatars.contentSize = CGSizeMake(250,300);
let imgView1: UIImageView = UIImageView(image: UIImage(named: "img1.jpg"))
let imgView2: UIImageView = UIImageView(image: UIImage(named: "img2.jpg"))
let imgView3: UIImageView = UIImageView(image: UIImage(named: "img3.jpg"))
scrollView_avatars.addSubview(imgView1)
scrollView_avatars.addSubview(imgView2)
scrollView_avatars.addSubview(imgView3)
}
iOS noob here
My code above gives me very bizarre output, i think the sizes of the UIImageViews are not set correctly.
I dont also know how to position the UIImageViews within the ScrollView like only part of a image is visible.
As #rmaddy says, you need to set the frame properties on your views. You will need to do math to calculate their positions based on row/column position in your grid of views.
If you're using AutoLayout you may need to generate constraints to set the view's sizes and positions. (I haven't tried to add views to a scroll view in code with AutoLayout before, so I'm not totally positive what happens if you just set their frames without defining constraints.)
You need to declare your image views like this:
if let image = UIImage(named: "myImage"){
let imageView = UIImageView(frame: CGRectMake(yourXpoint, yourYpoint, image.size.width, image.size.height))
imageView.image = image
}
where yourXpoint and yourYpoint is where you want the image origin to be set, this way you are saying to swift where do you want the images to be place and what is its size.
The if let is just to be safe in case the image does not exist.
Another good option is to set constrains as it will make your app have a nice layout in al different screen sizes and orientation

UI chat Screen in Ios

I am making app in which there is a chat window. In this window there is one image and a label on that image in custom cell.
I have take two custom cells, one for sender and other for receiver. Both cell are same with left and right alignment.
I want that when the length of comment is increased then whole comment shows in multiline within that image(increases the image size also) .
how can I handle this situation?
I am using setVariable method to set content on cell. I am trying comment code for framing like below comment code but it doesn't work
- ( void ) setComment : ( NSString* ) Comment
{
[ txtComment setText : Comment ] ;
/*CGRect frame1 = txtComment.frame;
frame1.size.height = txtComment.contentSize.height;
txtComment.frame=frame1;*/
}
I would suggest you use auto layout to define the custom cell height. It will help you create a dynamic cell height depending on the length of the comment. You can read about using dynamic height using auto layout in this link
To make this done you can do the following:
Subclass UITableViewCell and also create xib file.
Go to the xib file and add UIImageView and UILabel objects to your cell. Also create an outlet for the label.
As Pavan Kotesh mentioned the easiest way is to use auto layout.
Add top space and bottom space constraints to the cell content view for both image view and label. Then set constraints for x position for both subviews and finally set width and height constraints.
Height constraints must be "Greater of equal" type to let you change size of the views.
Having done that in Interface Builder all you need is to add one method to your subclass for setting a message.
- (void) setMessage: (NSString*) message
{
CGFloat oldLabelSize = _label.frame.size.height;
_label.text = message;
[_label sizeToFit];
CGFloat newLabelSize = _label.frame.size.height;
CGRect frame = self.frame;
frame.size.height += newLabelSize - oldLabelSize;
self.frame = frame;
}
After calling this method add the cell as subview to you chat view.
EDIT:
I think your -cellForRowAtIndexPath method implementation is wrong. What does [ChatViewCell send] perform?
I would have done it like this:
First declare two arrays in your table view controller class. The first is for storing the text of messages and the second for storing cell heights. Also you can create some structure to store those values. After user has finished inputing a message you should somehow estimate cell height and put both height and cell's message to the appropriate arrays. After that you should insert new row(section) in your tableview using insertRowsAtIndexPaths:withRowAnimation: method.
Then in your cellForRowAtIndexPath method:
If dequeueReusableCellWithIdentifier returns nil you should just initialise new ChatViewCell and after if (cell == nil) statement set its message from the appropriate array (due to reuse you should set cell's content every time it goes on screen).
In your heightForRowAtIndexPath: method return values from array that stores cell heights.

Resources