iOS文本的跑馬顯示

跑馬是大家都很熟悉的一種現象(嘿嘿嘿~~~),這個不做多解釋。我們會在眾多的app或者網頁上看到跑馬顯示的效果。
近期項目需要實現這樣一個功能:一個展示文字的控件顯示一段文字(例如一個標題),實現在左右方向上的循環滾動。為了實現這樣一個小功能,我就封裝了一個控件,用于實現其功能。
其具體的實現過程及代碼如下:
自定義視圖EntertainingDiversionsView繼承于UIView

EntertainingDiversionsView .h

#import <UIKit/UIKit.h>

@interface EntertainingDiversionsView : UIView

/**
 顯示字體的顏色   默認黑色
 */
@property(nonatomic,strong)UIColor *show_textColor;

/**
 顯示字體的大小  默認17
 */
@property(nonatomic,assign)CGFloat show_textFontSize;

/**
 顯示字體的背景顏色  默認白色
 */
@property(nonatomic,strong)UIColor *show_textBgColor;

/**
 滾動時間間隔 多長時間滾動一個像素 默認是0.01 值越小滾動的速度越快
 */
@property(nonatomic,assign)NSTimeInterval show_speedInterval;


/**
 跑馬燈初始化

 @param frame 位置
 @param runSpeedInteral 滾動速度間隔(以像素點為單位)
 @return EntertainingDiversionsView
 */
- (instancetype)initWithFrame:(CGRect)frame runSpeedInteral:(CGFloat)runSpeedInteral;
/**
 運動狀態下顯示的文字設置

 @param showText showText description
 */
-(void)showTextInRuning:(NSString *)showText;

/**
 開始滾動
 */
-(void)run;

/**
 暫停滾動
 */
-(void)stop;
@end

EntertainingDiversionsView .m

#import "EntertainingDiversionsView.h"

@interface EntertainingDiversionsView ()

@property(nonatomic, strong)NSTimer *timer;
@property(nonatomic, strong)UILabel *showTextLabel;

@end
@implementation EntertainingDiversionsView

-(instancetype)initWithFrame:(CGRect)frame runSpeedInteral:(CGFloat)runSpeedInteral{
    EntertainingDiversionsView *entertainingDiversionsView =[self initWithFrame:frame];
    _show_speedInterval = runSpeedInteral;
    
    [self initTimer];
    return entertainingDiversionsView;
}


- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        self.clipsToBounds = YES;//切除超出部分
    }
    return self;
}

-(UILabel *)showTextLabel{
    if (_showTextLabel == nil) {
        _showTextLabel = [[UILabel alloc]init];
        [self addSubview:_showTextLabel];
    }
    return _showTextLabel;
}

-(void)showTextInRuning:(NSString *)showText{
    self.showTextLabel.text = showText;
    NSDictionary *attribute = @{NSFontAttributeName:[UIFont boldSystemFontOfSize:18]};
    CGSize size = [self.showTextLabel.text sizeWithAttributes:attribute];
    self.showTextLabel.frame=CGRectMake(self.frame.size.width, 0, size.width, self.frame.size.height);
}

#pragma mark------初始化計時器,并設置計時器輪式切換的速度
-(void)initTimer{
    if (_timer == nil) {
        if (_show_speedInterval == 0) {
            _timer = [NSTimer timerWithTimeInterval:0.01 target:self selector:@selector(eventWithTimeChange) userInfo:nil repeats:YES];
        }else{
            _timer = [NSTimer timerWithTimeInterval:_show_speedInterval target:self selector:@selector(eventWithTimeChange) userInfo:nil repeats:YES];
        }
        [[NSRunLoop currentRunLoop]addTimer:_timer forMode:NSDefaultRunLoopMode];
        [_timer fire];
    }
}

#pragma mark------位置改變
-(void)eventWithTimeChange{
    CGRect rect = self.showTextLabel.frame;
    rect.origin.x -= 1;
    //設置rect.origin.x < rect.origin.x < -rect.size.width - rect.size.width/4的時候重置frame,是為了內容完全展示完畢的時候 有一個時間間隔 這個根據個人情況而定
    if (rect.origin.x < -rect.size.width - rect.size.width/4) {
        rect.origin.x = self.frame.size.width;
    }
    self.showTextLabel.frame = rect;
}

#pragma mark------屬性設置
-(void)setShow_textColor:(UIColor *)show_textColor{
    
    self.showTextLabel.textColor = show_textColor;
    
}

-(void)setShow_textBgColor:(UIColor *)show_textBgColor{
    
    self.showTextLabel.backgroundColor = show_textBgColor;
    
}

-(void)setShow_textFontSize:(CGFloat)show_textFontSize{
    
    self.showTextLabel.font = [UIFont boldSystemFontOfSize:show_textFontSize];
    
}
//開始滾動
-(void)run{
    [_timer setFireDate:[NSDate distantPast]];
}
//停止滾動
-(void)stop{
    [_timer setFireDate:[NSDate distantFuture]];
}
//釋放占用
-(void)dealloc{
    [_timer invalidate];
    _timer = nil;
}
@end

以上是其自定義過程,其使用也是相當的簡單,只需要實現:

entertainingDiversionsView = [[EntertainingDiversionsView alloc]initWithFrame:CGRectMake(20, 100, self.view.frame.size.width - 40, 40) runSpeedInteral:0.01];
[entertainingDiversionsView showTextInRuning:@"北京教培師訓網絡科技股份有限公司"];
[self.view addSubview:entertainingDiversionsView];

另外我們也可以設置一下跑馬字體的大小,顏色,背景顏色信息

entertainingDiversionsView.show_textColor = [UIColor redColor];
entertainingDiversionsView.show_textFontSize = 20;
entertainingDiversionsView.show_textBgColor = [UIColor greenColor];
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,517評論 6 539
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,087評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 177,521評論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,493評論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,207評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,603評論 1 325
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,624評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,813評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,364評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,110評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,305評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,874評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,532評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,953評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,209評論 1 291
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,033評論 3 396
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,268評論 2 375

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,692評論 25 708
  • 內容抽屜菜單ListViewWebViewSwitchButton按鈕點贊按鈕進度條TabLayout圖標下拉刷新...
    皇小弟閱讀 46,859評論 22 665
  • 淺拷貝:只復制指向對象的指針,而不復制引用對象本身。在另一個地方用同一個指針引用該對象。 深拷貝:復制引用對象本身...
    March_Cullen閱讀 199評論 0 1
  • “我對加班不深惡痛絕,但也不歡欣鼓舞,因為這是每個人的選擇,所有的一切在于你的心態”; “我見過所有成功的人,他們...
    需要了解閱讀 260評論 0 0
  • 一座橋斷了幾千年 湖水漣漣 醉了游人眼 西子湖畔沉淀了千古傳說 雷峰塔穿著古裝 佛音嘹亮 看著斷橋 書寫絕世滄桑 ...
    雨燕江南閱讀 374評論 1 10