1. 程式人生 > >ios中開發在cell上實現內容的動畫滑動效果

ios中開發在cell上實現內容的動畫滑動效果

1、使用UITableView顯示內容,應熟悉datasource 以及delegate設定以及方法的使用。

2、自定義cell寫法,可以使用storyBoard以及xib來進行實現自定義的方法來實現相關的內容。

3、父子檢視控制器之間的切換方法,有什麼?pressent、model、push……

4、 動畫core animation (在Quartz Core framework框架裡面),UIView.h 檔案中同樣有動畫的分類方法,且這裡是用這個方法,可以檢視程式碼。

5、:[self layoutIfNeeded];方法來實現頁面的重新整理,重新整理頁面的方法有好幾個,不知道用到哪一個好,碰到再說吧,哪位大神知道他們的卻別以及使用場景麻煩回覆一下,3Q。

6、[self.view reloadData];tableView中重新載入書局的方法。

難點以及重點:就是cell的自定義、動畫實現的方法。(這裡並不是使用CALayer的類來進行實現的)

<span style="color:#FF0000;"><span style="font-size:14px;">ViewController 的類的方法:</span>

</span>#import <UIKit/UIKit.h>
@interface ViewController : UIViewController <UITabBarControllerDelegate,UITableViewDataSource>
@end

#import "ViewController.h"
#import "CustomTableViewCell.h"
#import "SecondViewController.h"

@interface ViewController (){
    NSIndexPath *_indexPath;
    NSInteger _indexCount;
}
@property (weak, nonatomic) IBOutlet UITableView *tableView2;
@property (strong, nonatomic) NSArray *contents;
@property (strong, nonatomic) SecondViewController *svc;
@property (copy, nonatomic) NSArray *imageName;

@end

@implementation ViewController

- (void)viewWillAppear:(BOOL)animated{
    
    if (![_indexPath isEqual:nil] ) {
        //重新載入資料
      [self.tableView2 reloadData];
    }
}

- (void)viewDidLoad {
    [super viewDidLoad];
    _contents = @[@"lo90",@"dsgrt"];
    _imageName = @[@"0.jpg",@"1.jpg",@"2.jpg",@"3.jpg",@"4.jpg",@"5.jpg"];
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return _contents.count;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

    _indexPath = indexPath;
    static NSString *_cellName = @"CustomTableViewCell";
    CustomTableViewCell *_tableViewCell = [tableView dequeueReusableCellWithIdentifier:_cellName];
    _tableViewCell.contentLabel.text = _contents[indexPath.row];
    
    [_tableViewCell feedDataWithCustomCell];
    return _tableViewCell;
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    tableView.backgroundColor = [UIColor yellowColor];
    return 200;
}

#pragma mark UItableViewDelegate 
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    _svc = [[UIStoryboard storyboardWithName:@"Main" bundle:nil]instantiateViewControllerWithIdentifier:@"SecondViewController"];
    [self presentViewController:_svc animated:NO completion:nil];
}

@end
&&& ios中其實最為主要的是知道哪些方法是系統自動呼叫。

<pre name="code" class="objc">#import "SecondViewController.h"
@interface SecondViewController ()
@end
@implementation SecondViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
}
- (IBAction)onClickBack:(id)sender {
    [self dismissViewControllerAnimated:NO completion:nil];
}
@end
#import "CustomTableViewCell.h"
@interface CustomTableViewCell (){
    NSArray *_contents;
}
@end
@implementation CustomTableViewCell
//這裡實現基本的資料顯示
- (void)feedDataWithCustomCell{
    _contents 
[email protected]
[@"迴圈顯示內容1",@"迴圈顯示內容2",@"迴圈顯示內容3",@"迴圈顯示內容4",@"迴圈顯示內容5",@"迴圈顯示內容6",@"迴圈顯示內容7"]; self.label_ViewConstant.constant = CGRectGetHeight(self.SonOfCellView.frame); [self layoutIfNeeded]; [self startAnimationWithIndex:0 withConstant:0]; } //實現 動畫的效果 - (void)startAnimationWithIndex:(NSInteger)index withConstant:(NSInteger)constant{ NSInteger nextConstant; if (constant < 0) { nextConstant = 0; }else{ self.contentLabel.text = _contents[(index/2)%(_contents.count)]; nextConstant = -CGRectGetHeight(self.contentLabel.frame); } __weak typeof(self) weakSelf = self; CGFloat duration = 1.0+arc4random()%100/100.0; //實現動畫效果,這裡不是使用我們常用的基礎動畫或者關鍵動畫。 [UIView animateWithDuration:duration+2 animations:^{ weakSelf.label_ViewConstant.constant = constant; [weakSelf layoutIfNeeded]; } completion:^(BOOL finished) { if (finished) { if (constant<0) { weakSelf.label_ViewConstant.constant = CGRectGetHeight(self.contentLabel.frame); [weakSelf layoutIfNeeded]; } [weakSelf startAnimationWithIndex:index+1 withConstant:nextConstant]; } }]; } @end
第二頁面的控制器的類的程式碼:(只是實現了一個返回的介面

#import "SecondViewController.h"
@interface SecondViewController ()
@end
@implementation SecondViewController
- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
}
- (IBAction)onClickBack:(id)sender {
    [self dismissViewControllerAnimated:NO completion:nil];
}
@end

相關的StoryBoard的介面的屬性設定以及注意事項:

右邊對框內一定要選上,否則會出現有關的內容顯示在頁面上,沒有達到預想的想過。

執行之後的效果是:

就是文字可以在裡面自動的滑動,即使到了第二個頁面之後,還是能夠實現內容內容的重新整理。哈哈。

重寫的時候出現一個問題:

自定義的cell程式碼如下:

#import "CustomViewCell.h"

@interface CustomViewCell ()

@property (strong, nonatomic) NSArray *contents;

@end

@implementation CustomViewCell

- (void)feedTableViewCell{
    _contents [email protected][@"迴圈顯示內容1",@"迴圈顯示內容2",@"迴圈顯示內容3",@"迴圈顯示內容4",@"迴圈顯示內容5",@"迴圈顯示內容6",@"迴圈顯示內容7"];
    self.toTopConstraint.constant = CGRectGetHeight(self.parentView.frame);
    [self layoutIfNeeded];
    [self startAnimationWithIndex:0 withConstant:20];
}

- (void) startAnimationWithIndex:(NSInteger)index withConstant:(NSInteger)constant{
    
     NSInteger nextConstant;
    
    if (constant !=20) {
        nextConstant = 20;
    }else{
        //為什麼是和這裡的值有關的呢?
        //出現問題:就是我們在執行第一次的時候顯示的內容可能會變化,二第二次之後就不會發生變化,並且與這個值有很大的關係,如果設定為父檢視的高度就沒有問題,如果設定為其他的就會出現這個問題。
        //原理:也就是沒有設定為父檢視的高度,在執行的時候,沒有有相應的約束,這個時候會出現在執行的時候慢適應的過程。所以我們應該設定nextConstant的值為父檢視的大小,或者設定label的寬度和高度的約束。
        nextConstant = -20;
    }
    
    self.labelName.text = _contents[(index/2)%(_contents.count)];
    
    [UIView animateWithDuration:3
                     animations:^{
                         self.toTopConstraint.constant = constant;
                         [self layoutIfNeeded];
                     } completion:^(BOOL finished) {
                         if (finished) {
                             if (constant != 20) {
                                 self.toTopConstraint.constant = 60;                                 [self layoutIfNeeded];
                             }
                             [self startAnimationWithIndex:index+1 withConstant:nextConstant];
                         }
                     }];
}
@end

執行的結果沒有預想到的結果:

問題: 就是第一次的執行的label裡面的值 出現往上執行的時候裡面的值重新由大變小。

出現的問題設定的內容在程式碼有提示:(1)label沒有對其高度和寬度進行設定約束  (2)設定的nextConstant的絕對值的大小不是父檢視的大小的高度。

解決問題: (1)設定label的高、寬的約束 ,這樣,上面的那個值就隨便設定了 (2)nextConstant設定值為絕對值的大小(-),這樣不夠靈活。

小知識:

斷點的方式:br set -r "didSelect(過濾欄位)" 用來設定斷點。

相關推薦

ios開發cell實現內容動畫滑動效果

1、使用UITableView顯示內容,應熟悉datasource 以及delegate設定以及方法的使用。 2、自定義cell寫法,可以使用storyBoard以及xib來進行實現自定義的方法來實現相關的內容。 3、父子檢視控制器之間的切換方法,有什麼?pressent、

iOS開發cell內容重複

在iOS開發中,我們經常會重用單元格cell。在獲取cell之後,如果我們在cell之上新增其它控制元件的話,可能會導致下次重用此cell的時候會出現重複的內容,我們可以移除上次新增的子控制元件來防止重複。但是cell的子控制元件中還有一個UITableView

飛思卡爾的i.mx6dl開發實現nfs網路檔案系統掛載操作指南

問題描述:在MCIMX6DL_SDP上實現網路檔案掛載,要求從emmc中啟動uboot和kernel,從網路上掛載根檔案系統。 操作平臺: host :Ubuntu14.04LTS board:

全面解析iOSApp的名稱和內容以及啟動頁三大板塊的國際化方案

在做iOS專案時,App的國際化(I18N)幾乎是必做的一件事。App的國際化主要有應用名稱的國際化、內容的國際化,以及啟動頁的國家化。趁著週末有空在網上整理了一些比較全面的資料,給老鐵們分享下。De

iOS自定義View實現layoutSubviews佈局子控制元件

iOS開發中,- (void)layoutSubviews{}方法及相關方法注意點!! ==== ```objectivec - (void)creatAutoLayoutUSE { // 一、layout相關方法 } ``` - (void)layoutSubviews

iOS訊息轉發的實現

   嗯,執行時,執行時是個好東西。在Objective-C語言中,這個特性可以幫助我們幹很多的事情。    首先這個特性是把程式碼的決策從編譯和連結時變成執行的時候,這樣我們就可以用這個特性來做一些只有在執行的時候才能做到的東西,具體包括:    1.swizzling

iOS如何正確的實現行間距與行高

最近準備給 VirtualView-iOS 的文字元素新增一個 lineHeight 屬性,以便和 VirtualView-Android 配合時能更精確的保證雙平臺的一致性。面向 Google 以及 Stack Overflow 程式設計了一會後發現,能查到的資料大部分是介

在WPF的Canvas實現控制元件的拖動、縮放

   如題,專案中需要實現使用滑鼠拖動、縮放一個矩形框,WPF中沒有現成的,那就自己造一個輪子:)    造輪子前先看看Windows自帶的畫圖工具中是怎樣做的,如下圖:      在被拖動的矩形框四周有9個小框,可以從不同方向拖動來放大縮小矩形框,另外需要注意的是,還有一

ios常用到的簡單的動畫效果

1、有首尾動畫 //以beginAnimation作為標誌,此後的程式碼將作為動畫的有關屬性參與到動畫中 [UIview  beginAnimations:nil  context:nil]; [UI

iOS@功能的完整實現

點選上方“iOS開發”,選擇“置頂公眾號”關鍵時刻,第一時間送達!哼哼想不到吧,我又回來啦!好久

iOS專案開發實戰——Swift實現多個TableView的側滑與切換

       在Android中我們常常使用ListView來表示列表,來顯示類似的呈現列表樣式的結果。來到iOS中,這種控制元件稱之為TableView。這裡我們將會通過使用ScrollView和TableView結合的方式來實現可以側滑顯示的列表,這將會大大提高使用者體

vue結合animate.css實現元素動畫入場

話不多說先看下demo的GIF: 1.首先引入animate.css,可以直接在index.html中cdn引入; 2.其次在開發這種動畫較多的頁面我覺得還是引用jquery比較方便,操作dom稍多, 我這裡沒有使用jquery,就想複習複習原生js。可以npm安裝

手機實現細線的效果

手機 scale cnblogs orm png ati pan com pos 使用縮放, html 1 <div class="slim"></div> css 1 .slim{ 2 position: relative;

如何ScrollView在XIB或者Storyboard設定約束並實現翻頁滾動效果

使用XIB對檢視進行約束非常簡單,也很方便,節省了很多程式碼量,這是眾所周知的事情!但是UIScrollView的約束在XIB裡面比較複雜,而且有時候對它進行約束會經常出錯,當然,這是對你沒有在SV(以下UIScrollView簡稱)上放置別的檢視來說,假如你要

IOS應用開發16——UIViewContentMode各型別引數樣式效果

UIView有一個屬性:contentMode,用來表示如何顯示內容,取值引數為: typedef NS_ENUM(NSInteger, UIViewContentMode) { UIViewContentModeScaleToFill, UIViewCo

iOSposition:fixed吸底時的滑動出現抖動的解決方案

兩種抖動 為什麼抖動還會有兩種? 其實是我碰到過兩種抖動的場景,第一個場景是native的抖動,第二個場景是h5的抖動。 native的抖動 前端開發人員會在app中開啟webview,這個時候iOS中position:fixed吸底時的滑動出現抖動

android之ViewPager簡單實現區域性頁面滑動效果

-Viewpager能實現什麼效果? -實現左右滑動,切換view的效果。 -既可以實現整個頁面左右滑動,也可以實現同一個頁面中區域性左右滑動。 搞清楚viewpager的作用後,開始寫一個簡單例子,實現同一個頁面中區域性滑動的效果。 在coding前要做的準備工作 2

用TabLayout實現選項卡滑動效果

實際開發中,ViewPager經常結合Fragment來使用,然後再使用三方開源的PagerSlidingTabStrip去實現類似選項卡滑動效果。我之前那個APP的首頁就是這樣搭建的。 基於Material Design設計的分享文字圖片的APP 現在,我

jquery 實現導航欄滑動效果

精簡的程式碼實現導航欄滑動效果,實現詳解: 1.滑塊位置:通過父節點position=fixed,子節點position=absolute方式,實現子節點浮動; 2.導航欄居中:通過left=0px,right=0px,margin-left=auto,margi

[iOS]怎樣在iOS開發切換顯示語言實現國際化

art out title oca standard 文件 creat mit 工具類 1.在Project設置,加入中英兩種語言:2.新建Localizable.strings文件,作為多語言相應的詞典,存儲多種語言,點擊右側Localization,勾選中英:3.加入