可移動CollectionView實現(xiàn)記錄

這里僅僅只是記錄一下使用collectionView實現(xiàn)cell的可拖動改變位置。

效果圖:


Simulator Screen Shot - iPhone 8 - 2022-11-16 at 16.13.14.png

這里選擇使用collectionview來實現(xiàn)腿椎。

  1. collectionViewCell實現(xiàn)
  2. collectionView布局思灌、數(shù)據(jù)源設(shè)置
  3. collectionView代理實現(xiàn)
  4. collectionView添加長按手勢及手勢處理

collectionViewCell實現(xiàn)

繼承collectionViewCell照激,可以使用xib實現(xiàn),也可使用純代碼實現(xiàn)铃拇。這里使用xib實現(xiàn)


HmCollectionViewCell

collectionView布局钞瀑、數(shù)據(jù)源設(shè)置

collectionView布局

在繼承自UIViewController的VC中聲明collectionView變量、實現(xiàn)懶加載和添加到vc的view上

// collectionView變量聲明
@property (nonatomic, strong) UICollectionView *collectionView;

// collectionView添加到view上
[self.view addSubview:self.collectionView];

// collectionView懶加載
- (UICollectionView *)collectionView {
    if (!_collectionView) {
        
        UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
        layout.itemSize = CGSizeMake(100, 100);
        layout.minimumLineSpacing = 3;
        layout.minimumInteritemSpacing = 3;
        layout.scrollDirection = UICollectionViewScrollDirectionVertical;
        _collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, 306, 306) collectionViewLayout:layout];
        _collectionView.center = self.view.center;
        _collectionView.delegate = self;
        _collectionView.dataSource = self;
        _collectionView.backgroundColor = UIColor.whiteColor;
        [_collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([HmCollectionViewCell class]) bundle:[NSBundle mainBundle]] forCellWithReuseIdentifier:@"cell"];
    }
    return _collectionView;
}

數(shù)據(jù)源設(shè)置

因為涉及到cell的拖動和位置改變慷荔,所以數(shù)據(jù)源應(yīng)該使用可變數(shù)組來承載數(shù)據(jù)雕什。

// 聲明
@property (nonatomic, strong) NSMutableArray *data;

// 懶加載
- (NSMutableArray *)data {
    if (!_data) {
        NSMutableArray *arr = [NSMutableArray array];
        for (int i = 0; i < 9; i ++) {
            [arr addObject:[NSNumber numberWithInt:(i + 1)]];
        }
        _data = arr;
    }
    return _data;
}

collectionView代理實現(xiàn)

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return self.data.count;
}

- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    HmCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.nameLabel.text = [NSString stringWithFormat:@"%@", self.data[indexPath.row]];
    return cell;
}

// 只有實現(xiàn)這個代理并返回YES,cell才可移動
- (BOOL)collectionView:(UICollectionView *)collectionView canMoveItemAtIndexPath:(NSIndexPath *)indexPath {
    return YES;
}

- (void)collectionView:(UICollectionView *)collectionView moveItemAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath {
    id selected = self.data[sourceIndexPath.row];
    [self.data removeObject:selected];
    [self.data insertObject:selected atIndex:destinationIndexPath.row];
}

collectionView添加長按手勢及手勢處理

長按手勢添加在collectionView上显晶,通過手指長按的位置進行轉(zhuǎn)換至對應(yīng)的cell上贷岸,然后進行響應(yīng)的處理。

// 添加長按手勢
    UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(handlelongGesture:)];
    [self.collectionView addGestureRecognizer:longPress];

// 長按方法實現(xiàn)
- (void)handlelongGesture:(UIGestureRecognizer *)longPress {
    switch (longPress.state) {
      case UIGestureRecognizerStateBegan:
      { //手勢開始
        //判斷手勢落點位置是否在row上
        NSIndexPath *indexPath = [self.collectionView indexPathForItemAtPoint:[longPress locationInView:self.collectionView]];
        if (indexPath == nil) {
          break;
        }
        UICollectionViewCell *cell = [self.collectionView cellForItemAtIndexPath:indexPath];
        [self.view bringSubviewToFront:cell];
          cell.backgroundColor = [UIColor colorWithRed:1.0 green:0.2 blue:0.1 alpha:0.5];
        //iOS9方法 移動cell
        [self.collectionView beginInteractiveMovementForItemAtIndexPath:indexPath];
      }
        break;
      case UIGestureRecognizerStateChanged:
      { // 手勢改變
        // iOS9方法 移動過程中隨時更新cell位置
        [self.collectionView updateInteractiveMovementTargetPosition:[longPress locationInView:self.collectionView]];
      }
        break;
      case UIGestureRecognizerStateEnded:
      { // 手勢結(jié)束
        // iOS9方法 移動結(jié)束后關(guān)閉cell移動
        [self.collectionView endInteractiveMovement];
      }
        break;
      default: //手勢其他狀態(tài)
        [self.collectionView cancelInteractiveMovement];
        break;
    }
}

總結(jié)

至此整個collectionView的可移動操作設(shè)置結(jié)束磷雇。其中最重要的點在于實現(xiàn)collectionView的響應(yīng)代理偿警,尤其是可移動代理的實現(xiàn)。
這里僅僅做個記錄唯笙,方便以后使用到的時候查找螟蒸。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末盒使,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子七嫌,更是在濱河造成了極大的恐慌少办,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,542評論 6 504
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件抄瑟,死亡現(xiàn)場離奇詭異凡泣,居然都是意外死亡枉疼,警方通過查閱死者的電腦和手機皮假,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,822評論 3 394
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來骂维,“玉大人惹资,你說我怎么就攤上這事『焦耄” “怎么了褪测?”我有些...
    開封第一講書人閱讀 163,912評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長潦刃。 經(jīng)常有香客問我侮措,道長,這世上最難降的妖魔是什么乖杠? 我笑而不...
    開封第一講書人閱讀 58,449評論 1 293
  • 正文 為了忘掉前任分扎,我火速辦了婚禮,結(jié)果婚禮上胧洒,老公的妹妹穿的比我還像新娘畏吓。我一直安慰自己,他們只是感情好卫漫,可當我...
    茶點故事閱讀 67,500評論 6 392
  • 文/花漫 我一把揭開白布菲饼。 她就那樣靜靜地躺著,像睡著了一般列赎。 火紅的嫁衣襯著肌膚如雪宏悦。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,370評論 1 302
  • 那天包吝,我揣著相機與錄音肛根,去河邊找鬼。 笑死漏策,一個胖子當著我的面吹牛派哲,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播掺喻,決...
    沈念sama閱讀 40,193評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼芭届,長吁一口氣:“原來是場噩夢啊……” “哼储矩!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起褂乍,我...
    開封第一講書人閱讀 39,074評論 0 276
  • 序言:老撾萬榮一對情侶失蹤持隧,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后逃片,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體屡拨,經(jīng)...
    沈念sama閱讀 45,505評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,722評論 3 335
  • 正文 我和宋清朗相戀三年褥实,在試婚紗的時候發(fā)現(xiàn)自己被綠了呀狼。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,841評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡损离,死狀恐怖哥艇,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情僻澎,我是刑警寧澤貌踏,帶...
    沈念sama閱讀 35,569評論 5 345
  • 正文 年R本政府宣布,位于F島的核電站窟勃,受9級特大地震影響祖乳,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜秉氧,卻給世界環(huán)境...
    茶點故事閱讀 41,168評論 3 328
  • 文/蒙蒙 一眷昆、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧谬运,春花似錦隙赁、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,783評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至轰驳,卻和暖如春厚掷,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背级解。 一陣腳步聲響...
    開封第一講書人閱讀 32,918評論 1 269
  • 我被黑心中介騙來泰國打工冒黑, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人勤哗。 一個月前我還...
    沈念sama閱讀 47,962評論 2 370
  • 正文 我出身青樓抡爹,卻偏偏與公主長得像,于是被迫代替她去往敵國和親芒划。 傳聞我的和親對象是個殘疾皇子冬竟,可洞房花燭夜當晚...
    茶點故事閱讀 44,781評論 2 354

推薦閱讀更多精彩內(nèi)容