39

UICollectionViewサムネイルの水平方向にスクロール可能なリストを表示するために使用したいのですが、これを1行にしたいのです。別のビューでは、サムネイルをに表示してUICollectionViewいますが、これは垂直方向にスクロールし、単一の列にあります。

現在、これを行う方法は、コレクションビューのサイズを1つのアイテムに対して十分な大きさに変更して自動ラップして機能させることですが、現在は可変サイズのアイテムを扱っているため、機能しなくなりました。

どのようにしてUICollectionView1行または1列の表示を作成しますか？

4

10 に答える 10

30

ビルトインを使用していると思いますFlow Layout。ただし、あなたの場合は、カスタムを作成する必要がありますUICollectionView Layout。のサブクラスにして、次のコードをメソッドUICollectionViewFlowLayoutに追加します。init

- (id)init {
    if ((self = [super init])) {
        self.scrollDirection = UICollectionViewScrollDirectionHorizontal;
        self.minimumLineSpacing = 10000.0f;
    }
    return self; 
}

ここminimumLineSpacingで1行にするための鍵です。

これがお役に立てば幸いです。

于 2013-01-10T10:53:46.017 に答える
12

ちょうど設定するminimumLineSpacingと、スクロール領域が非常に大きくなり、設定minimumInteritemSpacing=bigによって、アイテムを1つのスクロールする行または列に保持し、中央に配置することができましたcollectionview。

于 2013-05-07T13:00:27.957 に答える
9

型キャストを信頼できるのであれば、サブクラス化する本当の理由はありません。

((UICollectionViewFlowLayout *)self.collectionView.collectionViewLayout).minimumLineSpacing = 1000.0f;

ペン先からcollectionViewをロードしている場合は、属性インスペクターとサイズインスペクターのパラメーターを試してみることもできます。

スクロール方向も同様です。

于 2013-05-15T03:40:10.287 に答える
7

UICollectionViewパスを初期化するときUICollectionViewFlowLayoutは、initパラメーターで次のようにします。

注：のサブクラスを作成する必要はありませんUICollectionViewFlowLayout

var collectionViewFlowControl = UICollectionViewFlowLayout()
collectionViewFlowControl.scrollDirection = UICollectionViewScrollDirection.Horizontal

0ピクセルのセル間隔の場合：

collectionViewFlowControl.minimumInteritemSpacing = 0;
collectionViewFlowControl.minimumLineSpacing = 0;

collectionView = UICollectionView(frame: CGRectMake(0, 0, self.view.frame.size.width, 120), collectionViewLayout: collectionViewFlowControl)
于 2015-09-15T11:16:17.063 に答える
6

iOS 13では、UICollectionViewCompositionalLayoutのおかげで、水平レイアウトの列ごとのセル数、または垂直レイアウトの行ごとのセル数を指定できるため、これは簡単です。水平方向にスクロールし、垂直方向に中央に配置された単一のセル行の簡単な例を次に示します。

func layout() -> UICollectionViewCompositionalLayout {
    let itemSize = NSCollectionLayoutSize(
        widthDimension: .fractionalWidth(1),
        heightDimension: .fractionalHeight(1))
    let item = NSCollectionLayoutItem(layoutSize: itemSize)
    let groupSize = NSCollectionLayoutSize(
        widthDimension: .absolute(75),
        heightDimension: .absolute(75))
    let group = NSCollectionLayoutGroup.vertical(
        layoutSize: groupSize, subitem: item, count: 1) // *
    group.edgeSpacing = NSCollectionLayoutEdgeSpacing(
        leading: nil, top: .flexible(0),
        trailing: nil, bottom: .flexible(0))
    let section = NSCollectionLayoutSection(group: group)
    section.interGroupSpacing = 65
    let config = UICollectionViewCompositionalLayoutConfiguration()
    config.scrollDirection = .horizontal
    let layout = UICollectionViewCompositionalLayout(
        section: section, configuration:config)
    return layout
}

コレクションビューcollectionViewLayoutをその関数呼び出しの出力に設定すると、すべて設定されます。

于 2019-12-06T02:36:58.780 に答える
2

Swift3の場合

let flowLayout = UICollectionViewFlowLayout()
flowLayout.itemSize = CGSize(width: UIScreen.main.bounds.width/2-10, height: 190)
flowLayout.sectionInset = UIEdgeInsetsMake(0, 5, 0, 5)
flowLayout.scrollDirection = UICollectionViewScrollDirection.horizontal
flowLayout.minimumInteritemSpacing = 0.0
self.gCollectionView.collectionViewLayout = flowLayout
于 2018-04-09T10:35:19.013 に答える
2

これは、CollectionViewの高さに関係なく、セルの単一行を取得するために機能しました。セルの最小間隔を1000に設定します

ストーリーボードUICollectionView

于 2019-07-17T15:20:54.463 に答える
1

私は1つの列が欲しかったのですが、左揃えで、他の答えは役に立ちませんでした。

これが、左揃えの1つの列に対する私の非常に単純なソリューションです。

class GCOneColumnLeftAlignedFlowLayout: UICollectionViewFlowLayout {
    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        let attributes = super.layoutAttributesForElements(in: rect)

        var y: CGFloat = sectionInset.top
        attributes?.forEach { layoutAttribute in
            layoutAttribute.frame.origin.x = sectionInset.left
            layoutAttribute.frame.origin.y = y
            y = y + layoutAttribute.frame.height + minimumLineSpacing
        }

        return attributes
    }
}

また、次のように設定する必要があります

estimatedItemSize = CGSize(width: 120, height: 40)

行を削除することを忘れないでください

minimumLineSpacing = big number

他のソリューションから。

他の回答とはまったく異なるアプローチであるため、これがお役に立てば幸いです。

于 2018-08-20T17:49:45.527 に答える
1

ドキュメントが最高だと思います：

minimumLineSpacingForSectionAt：

垂直方向にスクロールするグリッドの場合、この値は連続する行間の最小間隔を表します。水平方向にスクロールするグリッドの場合、この値は連続する列間の最小間隔を表します。この間隔は、ヘッダーと最初の行の間、または最後の行とフッターの間のスペースには適用されません。

minimumInteritemSpacingForSectionAt：

垂直方向にスクロールするグリッドの場合、この値は同じ行のアイテム間の最小間隔を表します。水平方向にスクロールするグリッドの場合、この値は同じ列のアイテム間の最小間隔を表します。この間隔は、1行に収まるアイテムの数を計算するために使用されますが、アイテムの数が決定された後、実際の間隔が上方に調整される可能性があります。

したがって、scrollDirection水平の場合はに設定minimumInteritemSpacingForSectionAtする必要があり、垂直のCGFloat.greatestFiniteMagnitude場合は1行を取得するためにに設定する必要がありますscrollDirectionminimumLineSpacingForSectionAtCGFloat.greatestFiniteMagnitudecollectionView

于 2019-12-05T17:47:32.387 に答える
0 
 UICollectionViewFlowLayout *layout=[[UICollectionViewFlowLayout alloc] init];
 [layout setScrollDirection:UICollectionViewScrollDirectionHorizontal];

 layout.minimumInteritemSpacing = 0;
 layout.minimumLineSpacing = 0;


 blendEffectCollectionView=[[UICollectionView alloc] initWithFrame:CGRectMake(0, 95, 320, 60) collectionViewLayout:layout];
 [blendEffectCollectionView setDataSource:self];
 [blendEffectCollectionView setDelegate:self];
 [blendEffectCollectionView registerClass:[BlendModeCell class] forCellWithReuseIdentifier:@"cellIdentifier"];
 [blendEffectCollectionView setBackgroundColor:[UIColor clearColor]];

 [bottomActivityView addSubview:blendEffectCollectionView];
于 2017-04-26T05:58:43.810 に答える