文档章节

使用swift在sprite中显示圆角UIButton按钮

 火镜先生
发布于 2014/07/12 21:26
字数 1311
阅读 6463
收藏 7

我对objective-C不是很熟,UIKit以前没有用过,SpriteKit也只看了遍教程,然后看了一遍swift语言教程,此时开始编写这个程序,所以遇到的问题比较小儿科,解决方法也是曲线救国,希望有高人指点解决这些问题的简单方法,有好的解决方法后,我会随时进行本日志的修改,以免误导他人。

程序界面很是简单

然后点击中间的游戏区域,会roll色子,随机产生1~6的数字,飞机前进若干步,遇到梯子向前跳若干步,而遇到蛇则后退若干步,指导抵达25格,游戏结束。

上面有一个标签,显示游戏状态和Roll点值。

下面有一个RESTART按钮,用来重新开始游戏,本日志的关键就是这个按钮。

起先我想法很简单,就是在sprite的scene里边添加一个按钮,但是SpriteKit里边我并没有发现类似按钮控件什么的,开始我使用Label替代按钮的功能,就是在点击事件中判断控件,然后再执行按钮相关代码,这种方法一是按钮太丑,二是点击时没有按钮的动作,三是按钮的方法调用实在是太山寨了。

后来我发现了UIButton,我参考了下面添加按钮的Objective-C代码:

CGRect frame = CGRectMake(90, 200, 200, 60);
    UIButton *someAddButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    someAddButton.backgroundColor = [UIColor clearColor];
    [someAddButton setTitle:@"动态添加一个按钮!" forState:UIControlStateNormal];
    someAddButton.frame = frame;
    [someAddButton addTarget:self action:@selector(someButtonClicked) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:someAddButton];

在此首先得看苹果一个官方文档,Using Swift with Cocoa and Objective-C

怎样修改OC代码到swift,按理上述代码和说明,第二行理应该改为

var someAddButton = UIButton.buttonWithType(.RoundedRect) as UIButton

其中按住command键单击buttonWithType函数,可以看出这是一个类型函数,并且返回AnyObject!类型,所以使用了as,但是并不能如我所愿,因为UIButtonType没有圆角矩形这个枚举类型

enum UIButtonType : Int {
    case Custom // no button type
    case System // standard system button
    
    case DetailDisclosure
    case InfoLight
    case InfoDark
    case ContactAdd
}

那我先放弃这个圆角矩形,使用一个普通按钮吧

        var btn  = UIButton()
        btn.setTitle("RESTART",forState: .Normal)
        
        btn.frame = CGRect(x:screen.bounds.size.width/2-50, y:screen.bounds.size.height-100,width:100,height:50)
        
        self.addChild(btn)
        //self.view.addSubview(btn)

问题又出现了,btn根本不是一个SKNode,无法添加上去,看OC的示例,明显btn是添加在view上的,于是改为注释的那一句,但是运行后,并没有显示按钮。这可如何是好呀。

于是我又开始查找资料,终于我发现了苹果另一个代码示例文档:UICatalog: Creating and Customizing UIKit Controls in Swift,这个示例代码我下载后,并没能运行,但是其中的各种控件使用示例肯定是不会错的,UIButton是添加在ViewController里边的,我的工程中就3个swift文件,其中一个就是GameViewController.swift,我看到里边的代码后就明白了,GameScene都是添加到这里边显示的,所以按钮也应该是添加到这儿。

所以在GameViewController的viewDidLoad方法中写添加按钮的代码:

    var btn:UIButton = UIButton()
    var gameScene:GameScene?
    override func viewDidLoad() {
        super.viewDidLoad()

        if let scene = GameScene.unarchiveFromFile("GameScene") as? GameScene {
            // Configure the view.
            let skView = self.view as SKView
            skView.showsFPS = true
            skView.showsNodeCount = true
            
            /* Sprite Kit applies additional optimizations to improve rendering performance */
            skView.ignoresSiblingOrder = true
            
            /* Set the scale mode to scale to fit the window */
            scene.scaleMode = .AspectFill

            skView.presentScene(scene)
            
            var screen = UIScreen.mainScreen()
            println("screen width:\(screen.bounds.size.width),height:\(screen.bounds.size.height)")
            btn.setTitle("RESTART",forState: .Normal)
            btn.backgroundColor = UIColor.redColor()
            btn.frame = CGRect(x:screen.bounds.size.width/2-50, y:screen.bounds.size.height-100,width:100,height:50)            

            skView.addSubview(btn)
            gameScene = scene
        }
    }

这样添加后,按钮总算是出来了,但还是无比的难看,我试过那个按钮类型,没有一个是能用的。

一是没有圆角矩形,二是一点没有按钮那种凸起感觉。

我又看了几个UIButton的几个方法,发现可以同时设置背景图片和设置按钮文字,那我不就可以弄一个按钮的图片,来制作一个圆角矩形的按钮了么。

于是我制作了下面的按钮图片:

需要注意:这个图片最好是png格式,这个橙色区域就是图片的全部,并没有白色底背景。我是使用苹果自带的图片预览的智能套索剪切的。

然后使用如下代码即可生成本日志开始截图的按钮:

class GameViewController: UIViewController {
    var btn:UIButton = UIButton()
    var gameScene:GameScene?
    override func viewDidLoad() {
        super.viewDidLoad()

        if let scene = GameScene.unarchiveFromFile("GameScene") as? GameScene {
            // Configure the view.
            let skView = self.view as SKView
            skView.showsFPS = true
            skView.showsNodeCount = true
            
            /* Sprite Kit applies additional optimizations to improve rendering performance */
            skView.ignoresSiblingOrder = true
            
            /* Set the scale mode to scale to fit the window */
            scene.scaleMode = .AspectFill

            skView.presentScene(scene)
            
            var screen = UIScreen.mainScreen()
            println("screen width:\(screen.bounds.size.width),height:\(screen.bounds.size.height)")
            
            let buttonTitle = NSLocalizedString("RESTART", comment: "you will restart the game")
            btn.setTitle(buttonTitle,forState: .Normal)
            
            var image = UIImage(named:"button")
            btn.setBackgroundImage(image,forState: .Normal)
            
            btn.frame = CGRect(x:screen.bounds.size.width/2-50, y:screen.bounds.size.height-100,width:100,height:50)
            
            btn.addTarget(self, action: "buttonClicked:", forControlEvents: .TouchUpInside)

            skView.addSubview(btn)
            gameScene = scene
        }
    }
    func buttonClicked(sender: UIButton) {
        print("A button was clicked: \(sender).")
        if let scene = gameScene? {
            println("board width:\(scene.spriteBoard.size.width),height:\(scene.spriteBoard.size.height)")
            var alert = scene.gameRestartAsk()
            presentViewController(alert, animated: true, completion: nil)

        }
    }

}

本人在IOS是个初学者,请多多指教,谢谢。




© 著作权归作者所有

粉丝 6
博文 33
码字总数 30096
作品 0
无锡
高级程序员
私信 提问
加载中

评论(8)

n
nlcold
圆角按钮这么写
var button: UIButton = UIButton.buttonWithType(UIButtonType.Custom) as UIButton
button.frame = CGRectMake(10, 150, 100, 30)
//设置圆角按钮
button.layer.cornerRadius = 5
//我也是初学,没有OC基础
d
dxscjx123
无论如何还是很感谢
火镜先生 博主

引用来自“dxscjx123”的评论

你好,你能详细给我说一下“开始我使用Label替代按钮的功能,就是在点击事件中判断控件,然后再执行按钮相关代码”你这个是怎么实现的吗
我记不太清楚了,又看了一下,应该是在touchesBegan方法里边判断是否是label: override func touchesBegan(touches: NSSet, withEvent event: UIEvent) { /* Called when a touch begins */ for touch: AnyObject in touches { let location = touch.locationInNode(self) let node = self.nodeAtPoint(location) if node === spriteBoard { game.play(); } } } 把上面的spriteBoard换成Label试试,当时实现的方法不是很常规,所以这个方法被放弃了
d
dxscjx123
你好,你能详细给我说一下“开始我使用Label替代按钮的功能,就是在点击事件中判断控件,然后再执行按钮相关代码”你这个是怎么实现的吗
d
dxscjx123

引用来自“火镜先生”的评论

我日志里边的图片为什么没有了

引用来自“dxscjx123”的评论

我是一名学生,刚接触oc用spritekit做一个游戏,看了你那篇日志后,对于如何在一个场景中生成一个按钮还不是特别懂,能否指点一下,谢谢

引用来自“火镜先生”的评论

你还在用OC吗,我用的不是OC,对OC也仅是了解,你遇到什么问题?
是的,我用的是oc,我知道在spritekit中生成一个文本框的函数是SKLabelNode,但我没找到生成一个按钮的函数。我现在想实现在当前这个场景点击按钮后,能够切换到另外一个场景,再返回最初的场景时,能够再生成另一个新的按钮。不好意思,语言有些拖沓。
火镜先生 博主

引用来自“火镜先生”的评论

我日志里边的图片为什么没有了

引用来自“dxscjx123”的评论

我是一名学生,刚接触oc用spritekit做一个游戏,看了你那篇日志后,对于如何在一个场景中生成一个按钮还不是特别懂,能否指点一下,谢谢
你还在用OC吗,我用的不是OC,对OC也仅是了解,你遇到什么问题?
d
dxscjx123

引用来自“火镜先生”的评论

我日志里边的图片为什么没有了
我是一名学生,刚接触oc用spritekit做一个游戏,看了你那篇日志后,对于如何在一个场景中生成一个按钮还不是特别懂,能否指点一下,谢谢
火镜先生 博主
我日志里边的图片为什么没有了
UITextView控件的详细讲解

1.创建并初始化 创建UITextView的文件,并在.h文件中写入如下代码: [csharp]view plaincopy #import <UIKit/UIKit.h> @interface TextViewController : UIViewController <UITextViewDeleg......

meilidashijie
2013/01/07
2.4K
0
Objective-c 手写控件

.h文件 #import <UIKit/UIKit.h> @interface ViewController : UIViewController @property(nonatomic,strong)NSTimer *timer; @end -----------------------------------------------------......

xtzPioneer
2015/11/16
69
0
UIImageView与UIButton

应用场合 UIImageView主要用在只显示图片,没有点击事件的情况并且处理图片更加专业,动画例子: NSMutableArray *images = [NSMutableArray array]; for (int i=0; i<sum; i++) { NSBundle ...

天边那束阳光
2014/10/01
2.2K
0
[非凡程序员]UIKit 手写控件

// // ViewController.m // 手写控件 // // Created by 非凡程序员 on 15/11/11. // Copyright (c) 2015年 Querida. All rights reserved. // #import "ViewController.h" @interface ViewC......

温暖c
2015/11/11
10
0
用UITextView撸一个顺畅的评论输入框

对比UITextField 继承关系: UITextField继承自UIControl,UITextView继承自UIScrollView; 输入行数 UITextView支持多行输入,可以滑屏垂直滚动,UITextField仅支持单行输入 Placeholder UI...

STzen
2018/05/10
0
0

没有更多内容

加载失败,请刷新页面

加载更多

最简单的获取相机拍照的图片

  import android.content.Intent;import android.graphics.Bitmap;import android.os.Bundle;import android.os.Environment;import android.provider.MediaStore;import andr......

MrLins
19分钟前
1
0
说好不哭!数据可视化深度干货,前端开发下一个涨薪点在这里~

随着互联网在各行各业的影响不断深入,数据规模越来越大,各企业也越来越重视数据的价值。作为一家专业的数据智能公司,个推从消息推送服务起家,经过多年的持续耕耘,积累沉淀了海量数据,在...

个推
20分钟前
4
0
第三方支付-返回与回调注意事项

不管是支付宝,微信,还是其它第三方支付,第四方支付,支付机构服务商只要涉及到钱的交易都要进行如下校验,全部成功了才视为成功订单 1.http请求是否成功 2.校验商户号 3.校验订单号及状态...

Shingfi
23分钟前
3
0
简述Java内存分配和回收策略以及Minor GC 和 Major GC(Full GC)

内存分配: 1. 栈区:栈可分为Java虚拟机和本地方法栈 2. 堆区:堆被所有线程共享,在虚拟机启动时创建,是唯一的目的是存放对象实例,是gc的主要区域。通常可分为两个区块年轻代和年老代。更...

DustinChan
29分钟前
4
0
Excel插入批注:可在批注插入文字、形状、图片

1.批注一直显示:审阅选项卡-------->勾选显示批注选项: 2.插入批注快捷键:Shift+F2 组合键 3.在批注中插入图片:鼠标右键点击批注框的小圆点【重点不可以在批注文本框内点击】----->调出批...

东方墨天
53分钟前
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部