2015年7月13日 星期一

[iOS] 滑動式可模糊文字顯示框(PAC Blurry Scroll View)


一樣是逛cocoa controls逛到的一個元件,覺得很有用因此就把它拿來用了

(不過沒想到有點難操作0rz)

PACScrollView

步驟只有三到四步,基本上也是把檔案先copy進去專案,然後  #import (有import才能夠使用該元件)

不外乎就github上基本的操作:

Basic usage

First, import PACBlurryScrollView.h header in th e .h file.
XIB way :
just add a scrollView in your Xib file and change the class type to PACBlurryScrollView
then, add the following code
    [pacScrollView setBackgroundImage:[UIImage imageNamed:@"bg.jpg"]];
Code way
    PACBlurryScrollView *pacScrollView = [[PACBlurryScrollView alloc] initWithFrame:self.view.bounds];
    [pacScrollView setBackgroundImage:[UIImage imageNamed:@"bg.jpg"]];
    [self.view addSubview:pacScrollView];
Don't forget to add content to your scrollView !
上面意思是說有兩種方法
1.XIB檔拉一個ScrollView,改class為PACBlurryScrollView,程式碼裡面增加這一行:
[pacScrollView setBackgroundImage:[UIImage imageNamed:@"bg.jpg"]];

2.第二種當然就是使用coding

    PACBlurryScrollView *pacScrollView = [[PACBlurryScrollView alloc] initWithFrame:self.view.bounds];
    [pacScrollView setBackgroundImage:[UIImage imageNamed:@"bg.jpg"]];
    [self.view addSubview:pacScrollView];

初始化一個pacScrollview格式,然後後續差不多,最後一定要addSubView!


以為這樣教學就結束了嗎?

如果你希望一開始的模糊感就有的話,就需要調整一下他原本的.m file

在PACBlurryScrollView.m這邊有一行

[_backgroundImageLayer setOpacity:(1.0f - (self.contentOffset.y / (self.contentSize.height - self.frame.size.height)))];

[_backgroundBlurryImageLayer setOpacity:(1.0f - _backgroundImageLayer.opacity)];

把1.0f調整為0.5f 就可以看出效果囉!

本次的教學就到這邊 END