Swift3のPageMenuでタブ

###前提・実現したいこと
タブメニューの幅を変動にし、タブメニュー自体を横スクロールできるように実装したい

###発生している問題・エラーメッセージ
https://teratail.com/questions/55957?whotofollow=
こちらで質問をさせていただき、PageMenu を使用してタブメニューの導入に成功しましたが、
タブを増やしていくとタブメニューの幅が固定されており、タブの文字が省略されていく・・という状況です。
swiftでの開発は初めてのため、色々調べてみているのですが全くわからないです。
理想はSmartNewsのようなタブメニューなのですが、
それを実現するためにPageMenuより良いライブラリがあれば教えて頂きたいです。
よろしくお願い致します

###現在実装済みのソースコード
Swift3
ViewController.swiftのみです。
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
// Viewを格納する配列
var controllerArray : [UIViewController] = []

    // 追加するViewを作成
    let controller1 : UIViewController = UIViewController()
    controller1.title = "ビューその１"
    controller1.view.backgroundColor = UIColor.blue
    controllerArray.append(controller1)
    
    let controller2 : UITableViewController = UITableViewController()
    controller2.title = "ビューその２"
    controller2.view.backgroundColor = UIColor.red
    controllerArray.append(controller2)
    
    let controller3 : UITableViewController = UITableViewController()
    controller3.title = "ビューその３"
    controller3.view.backgroundColor = UIColor.green
    controllerArray.append(controller3)
    
    let controller4 : UITableViewController = UITableViewController()
    controller4.title = "ビューその4"
    controller4.view.backgroundColor = UIColor.yellow
    controllerArray.append(controller4)
    
    let controller5 : UITableViewController = UITableViewController()
    controller5.title = "ビューその5"
    controller5.view.backgroundColor = UIColor.yellow
    controllerArray.append(controller5)
    
    // PageMenuの設定
    let parameters: [CAPSPageMenuOption] = [
        .menuItemSeparatorWidth(4.3),
        .useMenuLikeSegmentedControl(true),
        .menuItemSeparatorPercentageHeight(0.1)
    ]
    
    // PageMenuのビューのサイズを設定
    pageMenu = CAPSPageMenu(viewControllers: controllerArray, frame: CGRect(x:0.0, y:20.0, width:self.view.frame.width, height:self.view.frame.height), pageMenuOptions: parameters)
    
    // PageMenuのビューを親のビューに追加
    self.view.addSubview(pageMenu!.view)
    // PageMenuのビューをToolbarの後ろへ移動
    self.view.sendSubview(toBack: pageMenu!.view)
}

行動規範の内容に同意します

回答1件

ベストアンサー

.useMenuLikeSegmentedControl(true)だとセグメンタルコントロールのような挙動になるんですよ。つまり横幅が固定になります。falseにするか、オプション配列に加えなければメニュー幅は可変になります。

swift
1// PageMenuの設定
2let parameters: [CAPSPageMenuOption] = [
3.menuItemSeparatorWidth(4.3),
4.useMenuLikeSegmentedControl(false), // または削除
5.menuItemSeparatorPercentageHeight(0.1)
6] 
7

CAPSPageMenuOptionを調べると(コマンド＋クリックで確認)、用意されているオプションがわかります。ちなみに私は.titleTextSizeBasedOnMenuItemWidth(true)を追加してタブの幅をメニュー名の長さで可変になるようにしています。

swift
1public enum CAPSPageMenuOption {
2    case selectionIndicatorBottomOffset(CGFloat)
3    case selectionIndicatorHeight(CGFloat)
4    case menuItemSeparatorWidth(CGFloat)
5    case scrollMenuBackgroundColor(UIColor)
6    case viewBackgroundColor(UIColor)
7    case bottomMenuHairlineColor(UIColor)
8    case selectionIndicatorColor(UIColor)
9    case menuItemSeparatorColor(UIColor)
10    case menuMargin(CGFloat)
11    case menuItemMargin(CGFloat)
12    case menuHeight(CGFloat)
13    case selectedMenuItemLabelColor(UIColor)
14    case unselectedMenuItemLabelColor(UIColor)
15    case useMenuLikeSegmentedControl(Bool)
16    case menuItemSeparatorRoundEdges(Bool)
17    case menuItemFont(UIFont)
18    case menuItemSeparatorPercentageHeight(CGFloat)
19    case menuItemWidth(CGFloat)
20    case enableHorizontalBounce(Bool)
21    case addBottomMenuHairline(Bool)
22    case menuItemWidthBasedOnTitleTextWidth(Bool)
23    case titleTextSizeBasedOnMenuItemWidth(Bool)
24    case scrollAnimationDurationOnMenuItemTap(Int)
25    case centerMenuItems(Bool)
26    case hideTopMenuBar(Bool)
27    case menuShadowRadius(CGFloat)
28    case menuShadowOpacity(Float)
29    case menuShadowColor(UIColor)
30    case menuShadowOffset(CGFloat)
31    case addBottomMenuShadow(Bool)
32    case iconIndicator(Bool)
33    case iconIndicatorView(UIView)
34    case showStepperView(Bool)
35}