IOS 類似網易新聞客戶端內容滾動選單跟隨居中元件

2022-04-08 14:55:19 字數 2478 閱讀 3256

需求分析:

1、類似網易新聞客戶端頁面滾動元件、選單欄對應選單項一直居中

2、點選選單欄可以切換到對應的page

3、滑動頁面可以自動切換相應的選單、並且對應的選單欄居中顯示

4、初始化時可以自定義選單項

5、選單內容、頁面內容自定義

設計實現:

1、選單和頁面內容分別設計為兩個橫向滾動的uitableview,將兩個橫向滾動的tableview 放置在乙個uiview中

2、點選選單欄時響應該事件,並將頁面切換到響應頁

3、內容頁面滾動停止時,將對應選單項滾動到中間

實現效果:

四、關鍵**

1、橫向的tableview 如何實現

- (uitableview *)topmenutableview

//before rotate bounds = (0, 0, width, height) , rototate -90 bounds = (0, 0, height, width)

cgfloat x = cgrectgetwidth(self.frame)/2 - topmenuheight/2

; cgfloat y = -cgrectgetwidth(self.frame)/2 + topmenuheight/2

; cgrect topmenurect =cgrectmake(x, y, topmenuheight, cgrectgetwidth(self.frame));

_topmenutableview =[[uitableview alloc] initwithframe:topmenurect

style:uitableviewstyleplain];

[self addsubview:_topmenutableview];

_topmenutableview.backgroundcolor =[uicolor randomcolor];

_topmenutableview.datasource =self;

_topmenutableview.

delegate =self;

_topmenutableview.showsverticalscrollindicator =no;

_topmenutableview.transform = cgaffinetransformmakerotation(-m_pi / 2

);

}return

_topmenutableview;

}- (uitableview *)contenttableview

return

_contenttableview;

}

2、協議介面

/*

* @brief toptabcontrol datasource 需要支援的協議

*/@protocol toptabcontroldatasource@optional/**

* 得到頂部選單欄的高度

* * @param tabctrl tab控制項

* * @return 高度(畫素) */

- (cgfloat)toptabheight:(toptabcontrol *)tabctrl;/**

* 得到頂部選單欄的寬度

* * @param tabctrl tab控制項

* * @return 高度(畫素) */

- (cgfloat)toptabwidth:(toptabcontrol *)tabctrl;/**

* 得到頂部選單的個數

* * @param tabctrl tab控制項

* * @return 返回選單的個數 */

- (nsinteger)toptabmenucount:(toptabcontrol *)tabctrl;/**

* 得到第幾個選單的view

* * @param tabctrl tab控制項

* @param index 選單的index,從0開始

* * @return 返回單個選單項 */

- (toptabmenuitem *)toptabcontrol:(toptabcontrol *)tabctrl

itematindex:(nsuinteger)index;/**

* 得到第幾個選單對應的page內容

* * @param tabctrl tab控制項

* @param index 選單的index,從0開始

* * @return 返回單個選單頁 */

- (toptabpage *)toptabcontrol:(toptabcontrol *)tabctrl

pageatindex:(nsuinteger)index;

@end

五、完整**

仿網易新聞客戶端(一)

前些日子受到一位前同事的影響,決定利用業餘時間do something,於是決定仿寫點什麼,正好之前仿寫過網易雲 所以這次就仿個網易新聞吧,湊個雙,嘿嘿。說的輕鬆,目測網易新聞也不是那麼好實現的,個人認為主要的難點為 一切看似都充滿未知,但我卻已經越來越興奮了。第一階段的主要完成了對網易新聞整體框架...

新聞客戶端

1.首先編寫程式對應的布局檔案 android xmlns tools android layout width match parent android layout height match parent tools context mainactivity android orientatio...

畫素新聞IOS客戶端 隱私條例

畫素新聞ios客戶端尊重並保護所有使用服務使用者的個人隱私權。為了給您提供更準確 更有個性化的服務,畫素新聞ios客戶端會按照本隱私權政策的規定使用和披露您的個人資訊。但畫素新聞ios客戶端將以高度的勤勉 審慎義務對待這些資訊。除本隱私權政策另有規定外,在未徵得您事先許可的情況下,畫素新聞ios客戶...