IOS製作星星加分效果

2021-07-16 12:59:45 字數 3604 閱讀 2338

使用xib繪製5個星星(檢視),乙個動態顯示分數label

計算出最大,小的x,和星星寬度,建立乙個顯示總分數label

主要是手勢觸控時當觸控開始時控制如何顯示星星,當移動時控制如何顯示星星,當觸控結束時,給定動態顯示的分數

如何顯示星星:根據觸控點的x確定總分數,再讓根據總分數判斷呼叫顯示幾個星星的方法.

具體demo的**實現:

xib圖:

/** *設定顏色的值

*/#define rgbcolor(r,g,b,_alpha) [uicolor colorwithred:r/255.0 green:g/255.0 blue:b/255.0 alpha:_alpha]

@inte***ce

hhfstarview()

//5顆星星

@property (weak, nonatomic) iboutlet

uiimageview *firststar;

@property (weak, nonatomic) iboutlet

uiimageview *secondstar;

@property (weak, nonatomic) iboutlet

uiimageview *threestar;

@property (weak, nonatomic) iboutlet

uiimageview *fourthstar;

@property (weak, nonatomic) iboutlet

uiimageview *fivestar;

//顯示分數

@property (weak, nonatomic) iboutlet

uilabel *scorelabel;

//動態顯示分數label

@property(nonnull,strong) uilabel *label;

//分數

@property(nonatomic,assign) nsinteger leveal;

@end

//最大的x值

static

cgfloat maxx;

//最小的x值

static

cgfloat minx;

//邊距

static

const

cgfloat margin = 8.0;

//星星的寬度

static

cgfloat everywidth;

@implementation

hhfstarview

//類方法

+(instancetype) starview

//初始化maxx,minx,everywidth

- (void) initvalues

//建立動態顯示分數的label

- (void) createui

//設定單個星星的

- (uiimage *) setimageswithname:(nsstring *) imgname

//手勢觸控,當觸控開始時控制如何顯示星星

- (void) touchesbegan:(nsset*)touches withevent:(uievent *)event

//手勢觸控,當移動時控制如何顯示星星

- (void) touchesmoved:(nsset*)touches withevent:(uievent *)event

//當觸控結束時,給定動態顯示的分數

- (void) touchesended:(nsset*)touches withevent:(uievent *)event

//動態分數label會隨著顯示幾個星星改變中心點

_label.center = cgpointmake(n*everywidth+minx, _fivestar.top-20);

_label.alpha = 1;

[uiview animatewithduration:1 animations:^];

}- (void) setimageswithtouchs:(nsset *)touches

if (touchx < minx || touchx > maxx)

//確定分數

cgfloat dis = (touchx - minx) / everywidth;

[self setfivekongimg];

//分數

_leveal = (nsinteger)dis + 1;

if (dis >= 10.0)

//根據分數,顯示幾個星星

switch (_leveal)

//顯示共幾分

_scorelabel.text = [nsstring stringwithformat:@"共%d分",(int)_leveal];

}//設定原始5個空心星星

- (void) setfivekongimg

//設定圓心星星

- (void) setonezhengimg

- (void) settwozhengimg

- (void) setthreezhengimg

- (void) setfourzhengimg

- (void) setfivezhengimg

//設定圓心加空心的星星

- (void) setfistbanimg

- (void) setsecondbanimg

- (void) setthreebanimg

- (void) setfourthbanimg

- (void) setfifthbanimg

@end

#import "viewcontroller.h"

#import "hhfstarview.h"

@inte***ce

viewcontroller ()

@end

@implementation

viewcontroller

- (void)viewdidload

@end

執行效果:

IOS製作動畫效果

liketableviewcontroller.view frame cgrectmake 320 40 280 280 檢視起始框架 liketableviewcontroller.view alpha 0.6 檢視起始透明度 self view addsubview liketableviewc...

html5製作星星閃爍和製作時鐘

這次在w3和慕課網上 學習html5製作了星星閃爍和時鐘,期間也遇到了一些問題,比如 getcontext 讀不 1 星星閃爍展示 js var can var ctx var w var h var padleft 360 var padtop 100 var girlwidth 600 var ...

Tab切換效果製作

內容1內容1內容1內容1內容1內容1內容1 內容1內容1內容1內容1內容1內容1 內容2內容2內容2內容2內容2內容2內容2 內容2內容2內容2內容2內容2內容2 內容3內容3內容3內容3內容3內容3內容3 內容3內容3內容3內容3內容3內容3 內容4內容4內容4內容4內容4內容4內容4 內容4內容...