iOS關於菜單滾動視圖實現

来源:http://www.cnblogs.com/wujy/archive/2016/01/22/5150950.html
-Advertisement-
Play Games

菜單滾動視圖也是在項目開發過程中比較常用到的功能，先直接看效果圖實現的效果如下：當菜單個數的總長度超過一個屏寬度就計算每一個的文字寬度，若沒有則只進行一個屏平分，點擊菜單項時，滾動的視圖位置會隨著調整；下麵將會把代碼貼出來；1：控制器.h文件的內容//// myScrollerViewContro....


菜單滾動視圖也是在項目開發過程中比較常用到的功能，先直接看效果圖

 

實現的效果如下：

當菜單個數的總長度超過一個屏寬度就計算每一個的文字寬度，若沒有則只進行一個屏平分，點擊菜單項時，滾動的視圖位置會隨著調整；下麵將會把代碼貼出來；

1：控制器.h文件的內容

//
//  myScrollerViewController.h
//  testTest
//
//  Created by wujunyang on 16/1/22.
//  Copyright © 2016年 wujunyang. All rights reserved.
//

#import <UIKit/UIKit.h>

@protocol myScrollTabBarDelegate <NSObject>

@optional

- (void)itemDidSelectedWithIndex:(NSInteger)index;

@end

@interface myScrollerViewController : UIViewController

@property (nonatomic, weak) id  <myScrollTabBarDelegate>delegate;
@property (nonatomic, assign) NSInteger currentIndex;
@property(nonatomic,copy)NSArray *myTitleArray;
@end

註意：這邊創建的一個delegate，主要是為了當點擊事件時把相應的動作往外傳，並把相應的菜單索引值傳出，方便做其它操作

2：.m控制器的內容

#import "myScrollerViewController.h"

#define SCREEN_WIDTH  ([UIScreen mainScreen].bounds.size.width)
#define SCREEN_HEIGHT ([UIScreen mainScreen].bounds.size.height)
#define TABBAR_TITLE_FONT [UIFont systemFontOfSize:18.f]
#define NAV_TAB_BAR_HEIGHT 50
#define NAV_TAB_BAR_Width  SCREEN_WIDTH

@interface myScrollerViewController ()
//滾動視圖
@property(strong,nonatomic)UIScrollView *myScrollView;
//滾動下劃線
@property(strong,nonatomic)UIView *line;
//所有的Button集合
@property(nonatomic,strong)NSMutableArray  *items;
//所有的Button的寬度集合
@property(nonatomic,copy)NSArray *itemsWidth;
//被選中前面的寬度合（用於計算是否進行超過一屏，沒有一屏則進行平分）
@property(nonatomic,assign)CGFloat selectedTitlesWidth;

@end

@implementation myScrollerViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.automaticallyAdjustsScrollViewInsets=NO;
    
    self.view.backgroundColor=[UIColor whiteColor];
    
    //初始化數組
    if (!self.myTitleArray) {
        self.myTitleArray=@[@"新聞",@"NBA",@"財經",@"科技",@"軟體公司",@"健身",@"優秀文摘"];
    }
    
    self.items=[[NSMutableArray alloc]init];
    self.itemsWidth=[[NSArray alloc]init];
    
    //初始化滾動
    if (!self.myScrollView) {
        self.myScrollView=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 64, NAV_TAB_BAR_Width, NAV_TAB_BAR_HEIGHT)];
        self.myScrollView.backgroundColor=[UIColor redColor];
        self.myScrollView.showsHorizontalScrollIndicator = NO;
        self.myScrollView.showsVerticalScrollIndicator = NO;
        [self.view addSubview:self.myScrollView];
    }
    
    //賦值跟計算滾動
    _itemsWidth = [self getButtonsWidthWithTitles:self.myTitleArray];
    CGFloat contentWidth = [self contentWidthAndAddNavTabBarItemsWithButtonsWidth:_itemsWidth];
    self.myScrollView.contentSize = CGSizeMake(contentWidth, 0);
    
    self.currentIndex=0;
}

/**
 *  @author wujunyang, 16-01-22 13:01:45
 *
 *  @brief  計算寬度
 *
 *  @param titles <#titles description#>
 *
 *  @return <#return value description#>
 *
 *  @since <#version number#>
 */
- (NSArray *)getButtonsWidthWithTitles:(NSArray *)titles;
{
    NSMutableArray *widths = [@[] mutableCopy];
    _selectedTitlesWidth = 0;
    for (NSString *title in titles)
    {
        CGSize size = [title boundingRectWithSize:CGSizeMake(CGFLOAT_MAX, CGFLOAT_MAX) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName : TABBAR_TITLE_FONT} context:nil].size;
        CGFloat eachButtonWidth = size.width + 20.f;
        _selectedTitlesWidth += eachButtonWidth;
        NSNumber *width = [NSNumber numberWithFloat:eachButtonWidth];
        [widths addObject:width];
    }
    if (_selectedTitlesWidth < NAV_TAB_BAR_Width) {
        [widths removeAllObjects];
        NSNumber *width = [NSNumber numberWithFloat:NAV_TAB_BAR_Width / titles.count];
        for (int index = 0; index < titles.count; index++) {
            [widths addObject:width];
        }
    }
    return widths;
}
/**
 *  @author wujunyang, 16-01-22 13:01:14
 *
 *  @brief  初始化Button
 *
 *  @param widths <#widths description#>
 *
 *  @return <#return value description#>
 *
 *  @since <#version number#>
 */
- (CGFloat)contentWidthAndAddNavTabBarItemsWithButtonsWidth:(NSArray *)widths
{
    CGFloat buttonX = 0;
    for (NSInteger index = 0; index < widths.count; index++)
    {
        UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
        button.frame = CGRectMake(buttonX, 0, [widths[index] floatValue], NAV_TAB_BAR_HEIGHT);
        button.titleLabel.font = TABBAR_TITLE_FONT;
        button.backgroundColor = [UIColor clearColor];
        [button setTitle:self.myTitleArray[index] forState:UIControlStateNormal];
        [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        [button addTarget:self action:@selector(itemPressed:) forControlEvents:UIControlEventTouchUpInside];
        [self.myScrollView addSubview:button];
        
        [_items addObject:button];
        buttonX += [widths[index] floatValue];
    }
    if (widths.count) {
        [self showLineWithButtonWidth:[widths[0] floatValue]];
    }
    return buttonX;
}

/**
 *  @author wujunyang, 16-01-22 13:01:33
 *
 *  @brief  選中
 *
 *  @param currentIndex 選中索引
 *
 *  @since <#version number#>
 */
- (void)setCurrentIndex:(NSInteger)currentIndex
{
    _currentIndex = currentIndex;
    UIButton *button = nil;
    button = _items[currentIndex];
    [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    CGFloat offsetX = button.center.x - NAV_TAB_BAR_Width * 0.5;
    CGFloat offsetMax = _selectedTitlesWidth - NAV_TAB_BAR_Width;
    if (offsetX < 0 || offsetMax < 0) {
        offsetX = 0;
    } else if (offsetX > offsetMax){
        offsetX = offsetMax;
    }
    [self.myScrollView setContentOffset:CGPointMake(offsetX, 0) animated:YES];
    [UIView animateWithDuration:.2f animations:^{
        _line.frame = CGRectMake(button.frame.origin.x + 2.0f, _line.frame.origin.y, [_itemsWidth[currentIndex] floatValue] - 4.0f, _line.frame.size.height);
    }];
}

/**
 *  @author wujunyang, 16-01-22 13:01:47
 *
 *  @brief  增加下劃線
 *
 *  @param width Button的寬
 *
 *  @since <#version number#>
 */
- (void)showLineWithButtonWidth:(CGFloat)width
{
    _line = [[UIView alloc] initWithFrame:CGRectMake(2.0f, NAV_TAB_BAR_HEIGHT - 3.0f, width - 4.0f, 3.0f)];
    _line.backgroundColor = [UIColor blueColor];
    [self.myScrollView addSubview:_line];
}

- (void)cleanData
{
    [_items removeAllObjects];
    [self.myScrollView.subviews makeObjectsPerformSelector:@selector(removeFromSuperview)];
}

/**
 *  @author wujunyang, 16-01-22 11:01:27
 *
 *  @brief  選中時的事件
 *
 *  @param button <#button description#>
 *
 *  @since <#version number#>
 */
- (void)itemPressed:(UIButton *)button
{
    NSInteger index = [_items indexOfObject:button];
    self.currentIndex=index;
    
    if ([self.delegate respondsToSelector:@selector(itemDidSelectedWithIndex:)]) {
        [self.delegate itemDidSelectedWithIndex:index];
    }
    
    //修改選中跟沒選中的Button字體顏色
    for (int i=0; i<_items.count; i++) {
        if (i==index) {
            [button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
        }
        else
        {
             [_items[i] setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
        }
    }
   

    
    [UIView animateWithDuration:0.1 animations:^{
        button.transform = CGAffineTransformMakeScale(1.1, 1.1);
    } completion:^(BOOL finished) {
        [UIView animateWithDuration:0.1 animations:^{
            button.transform = CGAffineTransformIdentity;
        }completion:^(BOOL finished) {
            
        }];
    }];
}


- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

代碼都有進行相應的註解，接下來會對它進行整理，把它移到通用的MVC項目框架中，方便以後項目使用；

若對整理MVC通用的項目框架(意在快速開發時省去很多重覆工作)感興趣可以去下載，Git:https://github.com/wujunyang/MobileProject

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • java 中 return 的兩種常見的用法
    一：return語句總是用在方法中，有兩個作用： 一個是返回方法指定類型的值（這個值總是確定的）， 一個是結束方法的執行（僅僅一個return語句）。二：實例1 -- 返回一個Stringprivate String gets(){ String s = "qw789" ; ...
  • 用戶信息持久化解決方案
    demo鏈接：http://pan.baidu.com/s/1pJYHfMN做用戶信息持久化最麻煩的就是沙盒存取，然後再給單例賦值，我將這些操作封裝了一下，只需要傳入KEY中包含所有屬性的字典就行了，避免了繁瑣的操作
  • Genymotion 下載安裝常見錯誤一條龍
    Genymotion 安卓模擬器確實比安卓原生的模擬器快，但是除了快就找不到其他優點了...曾經嘗試在VM虛擬機內的Ubuntu系統裡面再運行Genymotion的，主要原因是要翻牆去下載一些東西，又不想完全連到vpn上，不過最後的結果是雙重夢境失敗，具體原因不是很清楚，提示是不能虛擬化(也許是技術...
  • Andrord問題小結
    問題描述：Gradle version 2.10 is required. Current version is 2.8.Gradle版本由2.8升為2.10後，發現所有依賴play-services的module都無法構建了，提示如下錯誤：java.io.FileNotFoundException...
  • iOS開發那些事兒（一）輪播器
    前言 市面上絕大部分的APP被打開之後映入眼帘的都是一個美輪美奐的輪播器，所以能做出一個符合需求、高效的輪播器成為了一個程式員的必備技能。所以今天的這篇博客就來談談輪播器這個看似簡單的控制項其中蘊含的道理。正文 首先我們來分析一下該如何去實現一個類似下圖的輪播器（圖片數量、URL由伺服器返...
  • 【JSONKit】序列化Dictionary崩潰
    jsonkit通過Dictionary轉換成JSON字元串時總是崩潰。解析代碼：崩潰地點分析是因為我的參數中全是數字找了一下原因，不知道知道怎麼設置，（求大神指點）這裡有一個折中辦法使用 NSJSONSerialization 進行序列化
  • Android 自定義對話框
    Android實現自定義對話框效果：核心代碼：package com.example.diydialog;import android.os.Bundle;import android.app.Activity;import android.app.AlertDialog;import androi...
  • OC中代理的使用
    通常代理的使用需要以下幾個步驟： 1、制定協議。協議可以在委托對象的.h中聲明，也可以在單獨的.h中聲明。制定協議後，在協議中聲明需要代理對象來實現的方法。 2、設置代理屬性。制定協議後需要為委托對象設置一個代理屬性，代理屬性的作用是存儲委托對象的代理對象。具體格式如下：@property (no....
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類