UITableView索引燕耿、cell動(dòng)畫(huà)

UITableView可以說(shuō)是iOS開(kāi)發(fā)中最常用的組件低千,今天來(lái)談?wù)刄ITableView如何實(shí)現(xiàn)索引和cell添加動(dòng)畫(huà)。---今天的話題比較輕松冗澈,不用看頭疼的Core... ...

看看最終要實(shí)現(xiàn)的效果先:

配圖

動(dòng)畫(huà)效果是隨便寫(xiě)的最簡(jiǎn)單的平移動(dòng)畫(huà)钦勘,大家可以根據(jù)自己的喜好來(lái)寫(xiě)

首先新建一個(gè)Single View Controller的項(xiàng)目,然后在main.stroyboard 價(jià)格tableView 亚亲,設(shè)置好代理彻采,在viewController中加一個(gè)tableView的變量。

首先來(lái)看看索引捌归,所以其實(shí)就需要一個(gè)數(shù)組肛响,這里我先寫(xiě)了一個(gè)數(shù)據(jù)源數(shù)組

//隨便寫(xiě)幾個(gè)城市
    private let citys = ["西安","北京","上海","廣州","深圳","杭州","重慶","南京","濟(jì)南","湖北","洛陽(yáng)","西寧","半島","瀘州","天津","桂林","大興安嶺","騾馬市","三峽","白水","常州","鹽城","懷化","湘潭","定西","天水"]

然后我們需要按照文字的首字母進(jìn)行排序,這里寫(xiě)一個(gè)String的擴(kuò)展惜索,根據(jù)漢子獲得對(duì)應(yīng)的拼音特笋。

extension String {
    
    func toPinYin() -> String {
        let mutableString = NSMutableString(string: self)
        //把漢字轉(zhuǎn)為拼音
        CFStringTransform(mutableString, nil, kCFStringTransformToLatin, false)
        //去掉拼音的音標(biāo)
        CFStringTransform(mutableString, nil, kCFStringTransformStripDiacritics, false)
        let string = String(mutableString)
        //去掉空格
        return string.stringByReplacingOccurrencesOfString(" ", withString: "")
    }
}

然后再聲明兩個(gè)變量

  var titles = [String]()  //放section的標(biāo)題
  var cityDics = [String:[String]]()  //放每個(gè)section的元素?cái)?shù)組

很明確就是為了分組,下面寫(xiě)一個(gè)工具方法處理數(shù)據(jù)源巾兆,給這兩個(gè)變量賦值

/**
     生成字典
     */
    func generalCityDics(){
        for city in citys{
            //將城市轉(zhuǎn)成拼音  然后取第一個(gè)字母 然后大寫(xiě)
            let key = city.toPinYin().substringToIndex(city.toPinYin().startIndex.advancedBy(1)).uppercaseString
            //判斷cityDics是否已經(jīng)存在此key
            if var cityValues = cityDics[key]{
                //拿出values 把city添加進(jìn)去
                cityValues.append(city)
                //重新賦值
                cityDics[key] = cityValues
                
            }else{
                //第一次賦值
                titles.append(key)
                cityDics[key] = [city]
            }
            //排序
            titles = titles.sort{ $0<$1 }
        }
    }

循環(huán)取拼音的第一個(gè)字母大寫(xiě)后當(dāng)key猎物,給key賦值數(shù)組,在viewDidLoad中調(diào)用這個(gè)方法就行了角塑。

先實(shí)現(xiàn)tableview的三個(gè)數(shù)據(jù)源的方法蔫磨,這些都是非常常用的操作,建議寫(xiě)成code snippet

以后用的時(shí)候就會(huì)比較快的輸出圃伶,提高coding效率

配圖

有些同學(xué)可能不知道怎么創(chuàng)建這種片段质帅,下面附教程

配圖

簡(jiǎn)單的就這樣啊,當(dāng)然還可以創(chuàng)建預(yù)設(shè)參數(shù)留攒,<#param#>

    // MARK: - tableView cell單元格信息
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("cell", forIndexPath: indexPath)
        cell.textLabel?.text =  self.cityDics[self.titles[indexPath.section]]![indexPath.row]
        return cell
    }
    
    
    // MARK: - 返回行數(shù)
    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.cityDics[self.titles[section]]!.count
    }
    
    /**
     section數(shù)
     */
    func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        return self.titles.count
    }

    /**
     標(biāo)題
     */
    func tableView(tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
        return self.titles[section]
    }
    
    /**
     索引數(shù)組
     */
    func sectionIndexTitlesForTableView(tableView: UITableView) -> [String]? {
        return self.titles
    }

然后就是實(shí)現(xiàn)tableview的這幾個(gè)方法就可以了,運(yùn)行項(xiàng)目 就有索引了嫉嘀。是不是so easy呀炼邀!

那么怎么實(shí)現(xiàn)cell的動(dòng)畫(huà)呢,可能比這個(gè)還要easy剪侮。就一個(gè)方法里面寫(xiě)動(dòng)畫(huà)就行啦

只要在 willDisplayCell中加上動(dòng)畫(huà)就行了

func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
        
        let rotationTransform = CATransform3DTranslate(CATransform3DIdentity,200,
            50, 0)
        cell.layer.transform = rotationTransform
        UIView.animateWithDuration(0.5, delay: 0, options: UIViewAnimationOptions.AllowUserInteraction, animations: { () -> Void in
            cell.layer.transform = CATransform3DIdentity
            }, completion: nil)
        
    }

我這里寫(xiě)的簡(jiǎn)單的平移動(dòng)畫(huà)拭宁,大家可以試試其他效果洛退。

代碼比較簡(jiǎn)單就不上傳了,希望大家喜歡

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末杰标,一起剝皮案震驚了整個(gè)濱河市兵怯,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌腔剂,老刑警劉巖媒区,帶你破解...
    沈念sama閱讀 218,546評(píng)論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異掸犬,居然都是意外死亡袜漩,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,224評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén)湾碎,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)宙攻,“玉大人,你說(shuō)我怎么就攤上這事介褥∽颍” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 164,911評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵柔滔,是天一觀的道長(zhǎng)溢陪。 經(jīng)常有香客問(wèn)我,道長(zhǎng)廊遍,這世上最難降的妖魔是什么嬉愧? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,737評(píng)論 1 294
  • 正文 為了忘掉前任,我火速辦了婚禮喉前,結(jié)果婚禮上没酣,老公的妹妹穿的比我還像新娘。我一直安慰自己卵迂,他們只是感情好裕便,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,753評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布。 她就那樣靜靜地躺著见咒,像睡著了一般偿衰。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上改览,一...
    開(kāi)封第一講書(shū)人閱讀 51,598評(píng)論 1 305
  • 那天下翎,我揣著相機(jī)與錄音,去河邊找鬼宝当。 笑死视事,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的庆揩。 我是一名探鬼主播俐东,決...
    沈念sama閱讀 40,338評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼跌穗,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了虏辫?” 一聲冷哼從身側(cè)響起蚌吸,我...
    開(kāi)封第一講書(shū)人閱讀 39,249評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎砌庄,沒(méi)想到半個(gè)月后羹唠,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,696評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡鹤耍,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,888評(píng)論 3 336
  • 正文 我和宋清朗相戀三年肉迫,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片稿黄。...
    茶點(diǎn)故事閱讀 40,013評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡喊衫,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出杆怕,到底是詐尸還是另有隱情族购,我是刑警寧澤,帶...
    沈念sama閱讀 35,731評(píng)論 5 346
  • 正文 年R本政府宣布陵珍,位于F島的核電站寝杖,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏互纯。R本人自食惡果不足惜瑟幕,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,348評(píng)論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望留潦。 院中可真熱鬧只盹,春花似錦、人聲如沸兔院。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,929評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)坊萝。三九已至孵稽,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間十偶,已是汗流浹背菩鲜。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,048評(píng)論 1 270
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留惦积,地道東北人接校。 一個(gè)月前我還...
    沈念sama閱讀 48,203評(píng)論 3 370
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像荣刑,于是被迫代替她去往敵國(guó)和親馅笙。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,960評(píng)論 2 355

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