沿曲線滾動

Question

我試圖獲得沿着彎曲路徑滾動uitableview的效果。基本上它就像屏幕邊上的凸出的桌面視圖，就好像它是一個大圓圈的一邊。我不想使用圖形效果來扭曲tableview，因爲文本會變得更難閱讀。

頂部和底部的項目比靠近中心的物體更接近屏幕邊緣。

Answer 1

這是我想出來的。這裏非常粗略的示範作爲概念驗證。

首先與myScrollView的連接已經使用IBOutlet進行設置，並掛接到xib中的滾動視圖。 後來我成立viewDidLoad中滾動視圖：

int scrollItems = 20; 
viewSize = 120; 
viewItems = [[NSMutableArray alloc] init]; 
[myScrollView setContentSize:CGSizeMake(myScrollView.frame.size.width, (viewSize*1.25)*scrollItems)]; 
for(int i = 0; i < scrollItems; i++){ 
    UIView *thisView = [[UIView alloc] initWithFrame:CGRectMake(myScrollView.frame.size.width/2, i*(viewSize*1.25), viewSize, viewSize)]; 
    [thisView setBackgroundColor:[UIColor blueColor]]; // spaced out blue squares 
    [myScrollView addSubview:thisView]; 
    [viewItems addObject:thisView]; 
} 
[myScrollView setDelegate:self]; 
[myScrollView setContentOffset:CGPointMake(0, 1)]; // to force initial items to curve 

}

這使具有全球NSMutableArray的沿滾動型的項目。它們均勻分佈，滾動視圖的大小正確。現在這些項目大致排列在我的滾動視圖的中間。給他們一個曲線添加下面的方法：

- (void)scrollViewDidScroll:(UIScrollView *)scrollView{ 
float start = [scrollView contentOffset].y;  
float height = scrollView.frame.size.height; 
float end = start + height; // change so it doesn't scoot views past the end 

float viewOffset, viewTop; 

int index = 0; 
for(UIView *thisView in viewItems){ 
    viewTop = thisView.frame.origin.y+thisView.frame.size.height; 
    if((viewTop>start)&&(thisView.frame.origin.y<end)){ // our visible range 
     viewOffset = thisView.frame.origin.y - start; 
     CGRect tempFrame = thisView.frame; 
     tempFrame.origin.x = 90 - sin((viewOffset/height)*4)*80; 
     thisView.frame = tempFrame; 
     index++; 
    } 
} 

}

這基本上採用了正弦波在由適量飛奔在可見光範圍內的每個項目。所以頂部和底部的物品幾乎沒有任何調整，並且中央物品被最遠地掃過。就好像半個正弦波一邊轉了一邊。

它在我的第一代iPad上運行得非常流暢。我非常喜歡它。有幾種方法可以加快速度......準確計算哪些視圖在內容區域中，只需觸及這些視圖，現在我正在檢查每個項目從頭到尾，這是浪費。預先傳送sin（）值也許是值得的。另一件事是scrollViewDidScroll可以在相同的位置更新2到3次，當沒有可見的更改時重做所有內容，因此許多詳細項目可能無法經常刷新。

享受。

Answer 2

我在想你需要一個自定義類，核心動畫。我不知道如何製作貝塞爾曲線，但基本上你需要一個裝滿了5個單元格視圖的整體視圖容器。如果向上移動，頂部視圖是'removeFromSuperview-ed'，並在底部添加一個新單元格。其他四個單元格將動畫到貝塞爾曲線上的下一個定義位置。不要太難，我認爲你需要弄清的最多的是：

曲線動畫 - 用x和y移動UIViews，根據x的移動來縮放視圖（越小越往上走或向下曲線）

功能加減細胞

一個函數來顯示/內容添加到每個小區

移動單元向上和向下

函數理想地，這將是自我包容。看看你是否可以像教程那樣找到一個自定義的封面流程，我認爲這與另一個動畫相似。