一、引言
近年来,随着移动互联网的快速发展,移动应用成为人们日常生活不可或缺的一部分。对于很多网站运营者,把网站打包成app是很不错的选择,因为可以让app用户方便快捷的使用网站的服务,提升用户体验,同时还可以扩展网站的影响力和用户群。本文将详细介绍如何把网站打包做成app。
二、原理介绍
把网站打包做成app的实质是在app中嵌入webview控件,通过webview加载网站,并自定义app样式和功能。简单来说,就是app里面打开一个网站而已。下面分别介绍必要的步骤:
1.创建项目:使用android studio创建一个新的项目;
2.设置主题:在res/values/styles.xml文件中设置app的主题;
3.添加网络权限:在androidmanifest.xml文件中添加网络权限,否则无法访问网络;
4.添加webview控件:在布局文件中添加webview控件;
5.加载网址并设置webviewclient:在代码中加载网址,并通过自定义webviewclient实现自适应网页大小、缩放、加载进度等功能;
6.设置chromeclient:在代码中通过自定义chromeclient实现网页打开、视频播放、javascript交互等功能;
7.设置返回键逻辑:在代码中添加返回键逻辑,实现app页面的正常返回。
三、详细步骤
下面详细介绍如何把网站打包做成app,以一个简单的示例为例。
1.创建新项目
打开android studio,选择“start a new android studio project”,按照提示操作创建新的项目。
2.设置app主题
在res/values/styles.xml文件中设置app的主题。可以使用系统默认主题,也可以自定义主题,比如设置app主题颜色为红色:
“`
@color/red
“`
3.添加网络权限
在androidmanifest.xml文件中添加网络权限,否则无法访问网络:
“`
“`
4.添加webview控件
在布局文件中添加webview控件。下面是一个简单的例子:
“`
android:layout_width=”match_parent”
android:layout_height=”match_parent”>
android:id=”@ id/webview”
android:layout_width=”match_parent”
android:layout_height=”match_parent” />
“`
5.加载网址并设置webviewclient
在代码中加载网址,并通过自定义webviewclient实现自适应网页大小、缩放、加载进度等功能。同时,为webview设置常用设置,如支持缩放、javascript、dom storage等:
“`
public class mainactivity extends appcompatactivity {
private webview webview;
@override
protected void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
setcontentview(r.layout.activity_main);
webview = (webview) findviewbyid(r.id.webview);
//设置常用设置
webview.getsettings().setjavascriptenabled(true);
webview.getsettings().setdomstorageenabled(true);
webview.getsettings().setdatabaseenabled(true);
//设置自适应屏幕、缩放等
webview.getsettings().setusewideviewport(true);
webview.getsettings().setloadwithoverviewmode(true);
webview.getsettings().setsupportzoom(true);
webview.getsettings().setbuiltinzoomcontrols(true);
//加载网址
webview.load;
//设置webviewclient
webview.setwebviewclient(new webviewclient() {
//页面开始加载
@override
public void onpag

estarted(webview view, string url, bitmap favicon) {
super.onpagestarted(view, url, favicon);
//显示加载进度
progressdialog.show(mainactivity.this, “”, “loading…”);
}
//页面加载完成
@override
public void onpagefinished(webview view, string url) {
super.onpagefinished(view, url);
//隐藏加载进度
progressdialog.dismiss();
}
//重定向
@override
public boolean shouldoverrideurlloading(webview view, string url) {
威尼斯人888-5845vip威尼斯电子游戏 view.load;
return true;
}
});
}
}
“`
6.设置chromeclient
在代码中通过自定义chromeclient实现网页打开、视频播放、javascript交互等功能:
“`
public class mainactivity extends appcompatactivity {
private webview webview;
@override
protected void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
setcontentview(r.layout.activity_main);
webview = (webview) findviewbyid(r.id.webview);
//设置常用设置
webview.getsettings().setjavascriptenabled(true);
webview.getsettings().setdomstorageenabled(true);
webview.getsettings().setdatabaseenabled(true);
//设置自适应屏幕、缩放等
webview.getsettings().setusewideviewport(true);
webview.getsettings().setloadwithoverviewmode(true);
webview.getsettings().setsupportzoom(true);
webview.getsettings().setbuiltinzoomcontrols(true);
//加载网址
webview.load;
//设置webviewclient
webview.setwebviewclient(new webviewclient() {
//页面开始加载
@override
public void onpagestarted(webview view, string url, bitmap favicon) {
super.onpagestarted(view, url, favicon);
//显示加载进度
progressdialog.show(mainactivity.this, “”, “loading…”);
}
//页面加载完成
@override
public void onpagefinished(webview view, string url) {
super.onpagefinished(view, url);
//隐藏加载进度
progressdialog.dismiss();
}
//重定向
@override
public boolean shouldoverrideurlloading(webview view, string url) {
view.load;
r威尼斯人888-5845vip威尼斯电子游戏eturn true;
}
});
//设置chromeclient
webview.setwebchromeclient(new webchromeclient(){
//网页标题改变
@override
public void onreceivedtitle(webview view, string title) {
super.onreceivedtitle(view, title);
getsupportactionbar().settitle(title);
}
//加载视频
@override
public void onshowcustomview(view view, customviewcallback callback) {
super.onshowcustomview(view, callback);
setrequestedorientation(activityinfo.screen_orientation_landscape);
}
//关闭视频
@override
public void onhidecustomview() {
super.onhidecustomview();
setrequestedorientation(activityinfo.screen_orientation_portrait);
}
//处理alert弹窗
@override
public boolean onjsalert(webview view, string url, string message, jsresult result) {
alertdialog.builder builder = new alertdialog.builder(mainactivity.this);
builder.setmessage(message)
.setpositivebutton(“ok”, new dialoginterface.onclicklistener() {
@override
public void onclick(dialoginterface dialog, int which) {
dialog.dismiss();
}
})
.create()
.show();
result.confirm();
return true;
}
});
}
}
“`
7.设置返回键逻辑
在代码中添加返回键逻辑,实现app页面的正常返回:
“`
@override
public boolean onkeydown(int keycode, keyevent event) {
if(keycode==keyevent.keycode_back && webview.cangoback()){
webview.goback();
return true;
}
return super.onkeydown(keycode, event);
}
“`
至此,我们就完成了把网站打包做成app的流程!
四、总结
把网站打包做成app可以提升网站的用户体验,加强和用户的互动,扩展网站的影响力和用户群。本文详细介绍了把网站打包做成app的流程和注意事项,希望对运营者们能有所帮助。
