[039] 微信公众帐号开发教程第15篇-自定义菜单的view类型（访问网页）

引言及内容概要

距离写上一篇文章《自己定义菜单的创建及菜单事件响应》整整过了两个月的时间，那时公众平台还沒有开放view类型的菜单。在不久前，微信公众平台悄悄开放了view类型的菜单，却沒有在首页公布不论什么通知，貌似微信团队非常喜欢这么干。一个偶然的机会，我留意到API文档的自己定义菜单接口发生了变化，添加了对菜单view类型的说明：

view（訪问网页）：

 用户点击view类型按钮后，会直接跳转到开发人员指定的url中。

于是我在第一时间更新了小q机器人（微信号：xiaoqrobot）的菜单，在一级菜单“许多其他”下添加了二级菜单“使用帮助”，点击该菜单项会直接跳转到网页，例如以下图所看到的。

 

 

近期也有不少网友问起这样的类型的菜单是怎样创建的，本篇文章就为大家介绍下view类型的自己定义菜单该怎样创建。

自己定义菜单的两种类型（click和view）

公众平台API文档中给出了自己定义菜单的json结构演示例子，我从中截取两个菜单项的json代码，一个是click类型，还有一个是view类型，例如以下所看到的。

1.     "type":"click",  
2.     "name":"今日歌曲",  
3.     "key":"V1001_TODAY_MUSIC"  
4.     "type":"view",  
5.     "name":"歌手简单介绍",  
6.     "url":"http://www.qq.com/"  

{	

	"type":"click",

	"name":"今日歌曲",

	"key":"V1001_TODAY_MUSIC"

},

{

	"type":"view",

	"name":"歌手简单介绍",

	"url":"http://www.qq.com/"

}

从上面能够看出，两种类型的菜单除了type值不同之外，属性也有区别。click类型的菜单有key属性，而view类型的菜单沒有key属性，与之相应的是url属性。通过上一篇的学习我们知道，key值是用于推断用户点击了哪个click类型的菜单项。而view类型的菜单沒有key属性，眼下无法在公众账号后台推断是否有用户点击了view类型的菜单项，也就没办法知道哪个用户点击了view类型的菜单项。

建立view类型的菜单对象

View类型的菜单有3个属性：type、name和url。在上一篇文章中，我们创建了菜单项的基类Button，Button类唯独一个属性name。View类型的菜单对象也须要继承Button类，代码例如以下：

1. package org.liufeng.weixin.pojo;  
2.  * view类型的菜单 
3.  * @author liuyq 
4.  * @date 2013-04-10 
5. public class ViewButton extends Button {  
6.     private String type;  
7.     private String url;  
8.     public String getType() {  
9.         return type;  
10.     public void setType(String type) {  
11.         this.type = type;  
12.     public String getUrl() {  
13.         return url;  
14.     public void setUrl(String url) {  
15.         this.url = url;  

package org.liufeng.weixin.pojo;



/**

 * view类型的菜单

 * 

 * @author liuyq

 * @date 2013-04-10

 */

public class ViewButton extends Button {

	private String type;

	private String url;



	public String getType() {

		return type;

	}



	public void setType(String type) {

		this.type = type;

	}



	public String getUrl() {

		return url;

	}



	public void setUrl(String url) {

		this.url = url;

	}

}

创建带view类型的菜单演示例子

我们对前一篇文章中给出的菜单创建代码进行调整，添加view类型的菜单项，完整的菜单创建代码例如以下：

1. package org.liufeng.weixin.main;  
2. import org.liufeng.weixin.pojo.AccessToken;  
3. import org.liufeng.weixin.pojo.Button;  
4. import org.liufeng.weixin.pojo.CommonButton;  
5. import org.liufeng.weixin.pojo.ComplexButton;  
6. import org.liufeng.weixin.pojo.Menu;  
7. import org.liufeng.weixin.pojo.ViewButton;  
8. import org.liufeng.weixin.util.WeixinUtil;  
9. import org.slf4j.Logger;  
10. import org.slf4j.LoggerFactory;  
11.  * 菜单管理器类 
12.  * @author liufeng 
13.  * @date 2013-08-08 
14. public class MenuManager {  
15.     private static Logger log = LoggerFactory.getLogger(MenuManager.class);  
16.     public static void main(String[] args) {  
17.         // 第三方用户唯一凭证  
18.         String appId = "000000000000000000";  
19.         // 第三方用户唯一凭证密钥  
20.         String appSecret = "00000000000000000000000000000000";  
21.         // 调用接口获取access_token  
22.         AccessToken at = WeixinUtil.getAccessToken(appId, appSecret);  
23.         if (null != at) {  
24.             // 调用接口创建菜单  
25.             int result = WeixinUtil.createMenu(getMenu(), at.getToken());  
26.             // 推断菜单创建结果  
27.             if (0 == result)  
28.                 log.info("菜单创建成功！");  
29.                 log.info("菜单创建失败，错误码：" + result);  
30.      * 组装菜单数据 
31.      * @return 
32.     private static Menu getMenu() {  
33.         CommonButton btn11 = new CommonButton();  
34.         btn11.setName("天气预报");  
35.         btn11.setType("click");  
36.         btn11.setKey("11");  
37.         CommonButton btn12 = new CommonButton();  
38.         btn12.setName("公交查询");  
39.         btn12.setType("click");  
40.         btn12.setKey("12");  
41.         CommonButton btn13 = new CommonButton();  
42.         btn13.setName("周边搜索");  
43.         btn13.setType("click");  
44.         btn13.setKey("13");  
45.         CommonButton btn14 = new CommonButton();  
46.         btn14.setName("历史上的今天");  
47.         btn14.setType("click");  
48.         btn14.setKey("14");  
49.         CommonButton btn15 = new CommonButton();  
50.         btn15.setName("电影排行榜");  
51.         btn15.setType("click");  
52.         btn15.setKey("32");  
53.         CommonButton btn21 = new CommonButton();  
54.         btn21.setName("歌曲点播");  
55.         btn21.setType("click");  
56.         btn21.setKey("21");  
57.         CommonButton btn22 = new CommonButton();  
58.         btn22.setName("经典游戏");  
59.         btn22.setType("click");  
60.         btn22.setKey("22");  
61.         CommonButton btn23 = new CommonButton();  
62.         btn23.setName("美女电台");  
63.         btn23.setType("click");  
64.         btn23.setKey("23");  
65.         CommonButton btn24 = new CommonButton();  
66.         btn24.setName("人脸识别");  
67.         btn24.setType("click");  
68.         btn24.setKey("24");  
69.         CommonButton btn25 = new CommonButton();  
70.         btn25.setName("聊天唠嗑");  
71.         btn25.setType("click");  
72.         btn25.setKey("25");  
73.         CommonButton btn31 = new CommonButton();  
74.         btn31.setName("Q友圈");  
75.         btn31.setType("click");  
76.         btn31.setKey("31");  
77.         CommonButton btn33 = new CommonButton();  
78.         btn33.setName("幽默笑话");  
79.         btn33.setType("click");  
80.         btn33.setKey("33");  
81.         CommonButton btn34 = new CommonButton();  
82.         btn34.setName("用户反馈");  
83.         btn34.setType("click");  
84.         btn34.setKey("34");  
85.         CommonButton btn35 = new CommonButton();  
86.         btn35.setName("关于我们");  
87.         btn35.setType("click");  
88.         btn35.setKey("35");  
89.         ViewButton btn32 = new ViewButton();  
90.         btn32.setName("使用帮助");  
91.         btn32.setType("view");  
92.         btn32.setUrl("http://liufeng.gotoip2.com/xiaoqrobot/help.jsp");  
93.         ComplexButton mainBtn1 = new ComplexButton();  
94.         mainBtn1.setName("生活助手");  
95.         mainBtn1.setSub_button(new Button[] { btn11, btn12, btn13, btn14, btn15 });  
96.         ComplexButton mainBtn2 = new ComplexButton();  
97.         mainBtn2.setName("休闲驿站");  
98.         mainBtn2.setSub_button(new Button[] { btn21, btn22, btn23, btn24, btn25 });  
99.         ComplexButton mainBtn3 = new ComplexButton();  
100.         mainBtn3.setName("许多其他");  
101.         mainBtn3.setSub_button(new Button[] { btn31, btn33, btn34, btn35, btn32 });  
102.          * 这是公众号xiaoqrobot眼下的菜单结构，每一个一级菜单都有二级菜单项<br> 
103.          * 在某个一级菜单下沒有二级菜单的情况，menu该怎样定义呢？<br> 
104.          * 比方，第三个一级菜单项不是“许多其他体验”，而直接是“幽默笑话”，那么menu应该这样定义：<br> 
105.          * menu.setButton(new Button[] { mainBtn1, mainBtn2, btn33 }); 
106.         Menu menu = new Menu();  
107.         menu.setButton(new Button[] { mainBtn1, mainBtn2, mainBtn3 });  
108.         return menu;  

package org.liufeng.weixin.main;



import org.liufeng.weixin.pojo.AccessToken;

import org.liufeng.weixin.pojo.Button;

import org.liufeng.weixin.pojo.CommonButton;

import org.liufeng.weixin.pojo.ComplexButton;

import org.liufeng.weixin.pojo.Menu;

import org.liufeng.weixin.pojo.ViewButton;

import org.liufeng.weixin.util.WeixinUtil;

import org.slf4j.Logger;

import org.slf4j.LoggerFactory;



/**

 * 菜单管理器类

 * 

 * @author liufeng

 * @date 2013-08-08

 */

public class MenuManager {

	private static Logger log = LoggerFactory.getLogger(MenuManager.class);



	public static void main(String[] args) {

		// 第三方用户唯一凭证

		String appId = "000000000000000000";

		// 第三方用户唯一凭证密钥

		String appSecret = "00000000000000000000000000000000";



		// 调用接口获取access_token

		AccessToken at = WeixinUtil.getAccessToken(appId, appSecret);



		if (null != at) {

			// 调用接口创建菜单

			int result = WeixinUtil.createMenu(getMenu(), at.getToken());



			// 推断菜单创建结果

			if (0 == result)

				log.info("菜单创建成功！");

			else

				log.info("菜单创建失败，错误码：" + result);

		}

	}



	/**

	 * 组装菜单数据

	 * 

	 * @return

	 */

	private static Menu getMenu() {

		CommonButton btn11 = new CommonButton();

		btn11.setName("天气预报");

		btn11.setType("click");

		btn11.setKey("11");



		CommonButton btn12 = new CommonButton();

		btn12.setName("公交查询");

		btn12.setType("click");

		btn12.setKey("12");



		CommonButton btn13 = new CommonButton();

		btn13.setName("周边搜索");

		btn13.setType("click");

		btn13.setKey("13");



		CommonButton btn14 = new CommonButton();

		btn14.setName("历史上的今天");

		btn14.setType("click");

		btn14.setKey("14");

		

		CommonButton btn15 = new CommonButton();

		btn15.setName("电影排行榜");

		btn15.setType("click");

		btn15.setKey("32");



		CommonButton btn21 = new CommonButton();

		btn21.setName("歌曲点播");

		btn21.setType("click");

		btn21.setKey("21");



		CommonButton btn22 = new CommonButton();

		btn22.setName("经典游戏");

		btn22.setType("click");

		btn22.setKey("22");



		CommonButton btn23 = new CommonButton();

		btn23.setName("美女电台");

		btn23.setType("click");

		btn23.setKey("23");



		CommonButton btn24 = new CommonButton();

		btn24.setName("人脸识别");

		btn24.setType("click");

		btn24.setKey("24");



		CommonButton btn25 = new CommonButton();

		btn25.setName("聊天唠嗑");

		btn25.setType("click");

		btn25.setKey("25");



		CommonButton btn31 = new CommonButton();

		btn31.setName("Q友圈");

		btn31.setType("click");

		btn31.setKey("31");



		CommonButton btn33 = new CommonButton();

		btn33.setName("幽默笑话");

		btn33.setType("click");

		btn33.setKey("33");

		

		CommonButton btn34 = new CommonButton();

		btn34.setName("用户反馈");

		btn34.setType("click");

		btn34.setKey("34");

		

		CommonButton btn35 = new CommonButton();

		btn35.setName("关于我们");

		btn35.setType("click");

		btn35.setKey("35");

		

		ViewButton btn32 = new ViewButton();

		btn32.setName("使用帮助");

		btn32.setType("view");

		btn32.setUrl("http://liufeng.gotoip2.com/xiaoqrobot/help.jsp");



		ComplexButton mainBtn1 = new ComplexButton();

		mainBtn1.setName("生活助手");

		mainBtn1.setSub_button(new Button[] { btn11, btn12, btn13, btn14, btn15 });



		ComplexButton mainBtn2 = new ComplexButton();

		mainBtn2.setName("休闲驿站");

		mainBtn2.setSub_button(new Button[] { btn21, btn22, btn23, btn24, btn25 });



		ComplexButton mainBtn3 = new ComplexButton();

		mainBtn3.setName("许多其他");

		mainBtn3.setSub_button(new Button[] { btn31, btn33, btn34, btn35, btn32 });



		/**

		 * 这是公众号xiaoqrobot眼下的菜单结构，每一个一级菜单都有二级菜单项<br>

		 * 

		 * 在某个一级菜单下沒有二级菜单的情况，menu该怎样定义呢？<br>

		 * 比方，第三个一级菜单项不是“许多其他体验”，而直接是“幽默笑话”，那么menu应该这样定义：<br>

		 * menu.setButton(new Button[] { mainBtn1, mainBtn2, btn33 });

		 */

		Menu menu = new Menu();

		menu.setButton(new Button[] { mainBtn1, mainBtn2, mainBtn3 });



		return menu;

	}

}

119~122行代码就是用于创建view类型菜单项的。上面的菜单结构也是小q机器人（微信号：xiaoqrobot）眼下在使用的，读者能够对比着理解。

补充：竟然还有些网友问我上面的自己定义菜单创建代码在哪里调用，问我为什么不把调用的代码也公开？搞的我都有点不好意思了。上面的菜单创建代码是写在main方法中，直接在开发工具中执行一下就能够了，这应该是最最基础的Java知识了。另外，菜单仅仅要创建一次，会一直存在的，不须要每次启动应用程序都去创建菜单。当然，你也能够把菜单的创建代码集成到项目中，并不是一定要放在main方法中。程序是死的，人是活的，解决方法往往有非常多种，怎么方便有用就怎么来！

假设认为文章对你有所帮助，请通过留言或关注微信公众帐号xiaoqrobot来支持柳峰！

转帖请注明本文出自柳峰的博客（http://blog.csdn.net/lyq8479），请尊重他人的辛勤劳动成果，谢谢！