i want to change the size of cells in a uicollectionview with a slider but i cant find how to do.
its like in the macOs finder when you see icons, you can change the size of it with a slider.
I want it for an iPad app
- (IBAction)sliderChanged:(id)sender {
[self.tableView reloadData];
}
Hook up your slider to the above method (for value changed), then use the following method to define the height:
- (CGFloat) tableView:(UITableView *)tableView heightForRowAtIndexPath:
(NSIndexPath *)indexPath {
return self.slider.value;
}
Nearly perfect, i want for a uicollection view so i need to change with:
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
//Return the size of each cell to draw
CGSize cellSize = (CGSize) { .width = 320, .height = self.slider.value};
return cellSize;
}
Related
I have UICollectionView inside UITableViewCell, cells are of dynamic width depending upon text.The problem I am facing is when i scroll the TableView after that collection inside cell is appearing correct.
Here is what I did, I called reloadData after datasource is set and also called invalidateLayout but not working
Here is what I did,
Inside tableViewCell class,
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
CGSize calCulateSizze =[[datasource objectAtIndex:indexPath.row] sizeWithAttributes:NULL];
NSLog(#"%f %f",calCulateSizze.height, calCulateSizze.width);
calCulateSizze.width = calCulateSizze.width+20;
calCulateSizze.height = 35;
return calCulateSizze;
}
#pragma mark - Public
- (void)setCellData:(id)pData {
GSHColumns *column = (GSHColumns*)pData;
if (column.options.count > 0) {
datasource = column.options;
[_collectionView reloadData];
[_collectionView.collectionViewLayout invalidateLayout];
}
[titleLabel setText:column.displayName];
}
Here is what it looks like before scrolling
and after scrolling,
In order to get a consistent size ratio between my views and the device, I make an equal width/height constraint between the view and the superview. However, when designing a UITableViewCell or a UICollectionViewCell, I can't find this option in the interface builder. I need to set a ratio between a view inside a cell and the superview. What is the cleanest way to accomplish this behavior?
You cannot do this in the storyboard and have to do it in code:
For UITableView:
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
return tableView.frame.size.width;
}
For UICollectionView:
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
int columns = 2; // Change this to whatever you want
float width = collectionView.frame.size.width / columns;
return CGSizeMake(width, width);
}
If you want to make your UITableViewCell the same size as superview of its table, you should do this:
1) Setup constraints to UITableView to equal width/height to superview, also setup its origin (for example center x/y in superview).
2) Return size for cell:
case UITableViewCell:
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
return tableView.frame.size.height;
}
case UICollectionViewCell:
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
return collectionView.frame.size;
}
I am using uicollection view to display the images in grid view format.I am able to display the cells but the height & width is not increased for iPad it only display as the small blocks.Please tell me how can i make it dynamic.
[![enter image description here][1]][1]
I have used following code for make it dynamic.
pragma mark Collection view layout things
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section {
if (collectionView==self.album_collection_view) {
return 2.0;
}
else
return 2.0;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section {
if (collectionView==self.album_collection_view) {
return 2.0;
}
else
return 2.0;
}
// Layout: Set Edges
- (UIEdgeInsets)collectionView:
(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
// return UIEdgeInsetsMake(0,8,0,8); // top, left, bottom, right
if (collectionView==self.album_collection_view) {
return UIEdgeInsetsMake(5,0,0,0);
}// top, left, bottom, right
else
return UIEdgeInsetsMake(5,0,0,0);
}
Please tell me how can i resolve this issue?
here is the solution
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
YourCollectionCell * cell = (YourCollectionCell *) [YourCollectionViewObj cellForItemAtIndexPath:indexPath];
if (cell == nil) {
NSArray *topLevelObjects = [[NSBundle mainBundle] loadNibNamed:#"YourCollectionCell" owner:self options:nil];
cell = [topLevelObjects objectAtIndex:0];
cell.frame = CGRectMake(0, 0, CGRectGetWidth(self.view.frame), 20);
// SET YOUR CONTENT
[cell layoutIfNeeded];
}
CGSize CellSize = [cell systemLayoutSizeFittingSize:UILayoutFittingCompressedSize withHorizontalFittingPriority:UILayoutPriorityDefaultHigh verticalFittingPriority:UILayoutPriorityDefaultLow];
return CellSize;}
In case above solution not meet your needs,To obtain what you want, you should create your own UICollectionViewLayout (or maybe UICollectionViewFlowLayout) subclass, where you perform all the computations needed for placing every item in the right frame.
Take a look here for a great tutorial and here for something similar to what you want.
If you want to increase cell height and width you have to use sizeForItemAtIndexPath method. for that you have to add UICollectionViewDelegateFlowLayout delegate.
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(100, 100);
}
I am stuck in frame of uicollectionview cell frame
what I want to do is,
in landscape mode of iPad I want to show 3 cells,
and in portrait 2 cells.
when I write the code of frame in method - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
its not affecting the size of frame.
I checked by applying debugger whether its coming in this method or not.
but its coming and returning the size.
by default I have to launch my application in landscape and then if required in portrait.
Here is how its showing in landscape
Here how this cells looking in portrait
Here is my code for frame
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
//return [self.cellSizes[indexPath.item] CGSizeValue];
if (UIDeviceOrientationIsLandscape([[UIApplication sharedApplication] statusBarOrientation]))
{
return CGSizeMake(100, 100);
}
return CGSizeMake(200, 200);
}
What ever value I pass, frame is not at all changing.
I didn't passed any other frame value any where.
I want to give hardcoded value to cell frame first then will go for dynamic.
but I'm stuck at the first place only.
Can any one please help me.
Thanks in advance.
i faced similiar problem so basically you should implement UICollectionViewDelegateFlowLayout in your view controller otherwise design a custom collectionviewcell and register in your view controller , it will definitely work . Try it .
in my case
i added xib by subclassing UICollectionViewCell and designed it accordingly and it works so you may try .
For dynamic collection view cell you can use collection view methods like this.
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 1;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection: (NSInteger)section{
return [_elements count];
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
static NSString *cellIdentifier = #"cell";
MosaicCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:cellIdentifier forIndexPath:indexPath];
MosaicData *data = [_elements objectAtIndex:indexPath.row];
cell.mosaicData = data;
float randomWhite = (arc4random() % 40 + 10) / 255.0;
cell.backgroundColor = [UIColor colorWithWhite:randomWhite alpha:1];
return cell;
}
For details you can see this example. This is an perfect example of your need
https://github.com/betzerra/MosaicLayout
You need to reload the collection view when orientation will get change. so the CGRect size method will be called for the cell to recreate cell.
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation
{
// do something after rotation
[_collectView reloadData];
}
Add this method and reload your collection view so - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath will get called and size will get changed.
Thanks
I am attempting to lay my UICollectionView out such that it is a 2x3 grid per page. Here is what I am getting so far:
As you can see, the next "page" is peeping in from the right, which I don't want. I figured if I know my width is always going to be 320pts (iPhone only), then I would want my cells to be 130pts in width with 15pts on either side.
Code for layout delegate:
- (CGSize)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout*)collectionViewLayout
sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
return CGSizeMake(130, 130);
}
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout*)collectionViewLayout
insetForSectionAtIndex:(NSInteger)section {
return UIEdgeInsetsMake(20.0f, 15.0f, 20.0f, 15.0f);
}
And also cellForItemAtIndexPath:
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
cellForItemAtIndexPath:(NSIndexPath *)indexPath{
CustCollectionViewCell *cell =
[collectionView dequeueReusableCellWithReuseIdentifier:kReuseID
forIndexPath:indexPath];
//Set up list name label
cell.LblListName.font = [self getDefaultFontWithSize:15.0f];
cell.LblListName.textColor = fontAndTertiaryColor;
cell.LblListName.textAlignment = NSTextAlignmentCenter;
cell.LblListName.text = #"Failtron";
//cell.LblListName.adjustsFontSizeToFitWidth = YES;
cell.backgroundColor = secondaryColor;
cell.parallaxIntensity = kParallaxMotion;
[Utilities createViewBorder:cell];
return cell;
}
I thought an inset would act like padding in CSS but I believe I'm off the mark with that one, I should also note that in the UIStoryboard my layout is set to flow. Please let me know if I am missing any relevant code, this is my first attempt with a UICollectionView. I would like this to scroll horizontally as well.
Ok, there are tons of ways to manipulate layouts for a UICollectionView, but sounds like since you are using "flow" you can just implement <UICollectionViewDelegateFlowLayout> in your .h and then use the following methods to tweak your layout to your liking:
#pragma mark – UICollectionViewDelegateFlowLayout
- (CGSize)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout*)collectionViewLayout
sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
// Size of the cell
CGSize retval = CGSizeMake(130,130);
return retval;
}
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout*)collectionViewLayout
insetForSectionAtIndex:(NSInteger)section {
//top, left, bottom, right
return UIEdgeInsetsMake(0, 20, 0, 20);
}
- (CGFloat)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout *)collectionViewLayout
minimumInteritemSpacingForSectionAtIndex:(NSInteger)section {
//Minimum spacing between cells
CGFloat interimSpacing = 0.0f;
return interimSpacing;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView
layout:(UICollectionViewLayout *)collectionViewLayout
minimumLineSpacingForSectionAtIndex:(NSInteger)section {
// Minimum spacing between lines. In your case,
this is the distance between columns
// If your scroll direction was vertical,
this would be the distance between rows
CGFloat lineSpacing = 20.0f;
return lineSpacing;
}
I've prepopulated this code with some values that should be pretty darn close to what you wanted to accomplish.
Alternatively, all of this can be done in Interface Builder by selecting the UICollectionView and adjusting the values in the Size Inspector, albeit more confusing in my opinion.