二、工程配置
2.1.fusion app配置
- 新建工程
在主页点击加号新建工程-->选择空白模板,再点击创建,创建完成按如下配置:
- 增加子页面
在子页面,点击+号,选择底栏模板,页面名称“哔哩哔哩”。注意这里的页面名称需要和代码中进入子页面("哔哩哔哩")
中的文字匹配,这也是fa实现子页面跳转的关键。
再点击刚建好的子页面,在程序启动事件中增加如下代码:
加载网页("https://m.bilibili.com/index.html")
- 增加程序启动事件
在主页面(左上角显示为工程编辑的是主页面)自定义事件-->程序启动中,增加如下代码:
layout={
LinearLayout;
layout_height="fill";
layout_width="fill";
orientation="vertical";
{
LinearLayout;
layout_height="30%h";
layout_width="match_parent";
{
RelativeLayout;
layout_height="match_parent";
layout_width="match_parent";
{
TextView;
layout_height="wrap_content";
textSize="20sp";
text=[==[Hello,
欢迎来到 我的视频站]==];
layout_marginLeft="20dp";
textColor="0xFF000000";
layout_marginTop="70dp";
layout_width="wrap_content";
};
};
};
{
LinearLayout;
layout_height="45%h";
layout_width="match_parent";
orientation="vertical";
{
CardView;
layout_height="match_parent";
id="登录页面";
layout_width="match_parent";
{
RelativeLayout;
layout_height="match_parent";
padding="20dp";
layout_width="match_parent";
{
CardView;
layout_height="45dp";
id="卡片1";
radius="10dp";
backgroundColor="#DCDCDC";
layout_width="match_parent";
{
EditText;
textColor="0xFF000000";
hintTextColor="0xFF585858";
backgroundColor="0x00ffffff";
InputType='number';
hint="请输入账号";
id="user";
layout_width="match_parent";
};
};
{
CardView;
layout_height="45dp";
id="卡片2";
layout_below="卡片1";
layout_marginTop="20dp";
radius="10dp";
backgroundColor="#DCDCDC";
layout_width="match_parent";
{
EditText;
textColor="0xFF000000";
hintTextColor="0xFF585858";
backgroundColor="0x00ffffff";
id="pass";
hint="请输入密码";
password="true";
layout_width="match_parent";
};
};
{
CardView;
layout_height="45dp";
id="卡片3";
layout_below="卡片2";
layout_marginTop="20dp";
radius="10dp";
backgroundColor="0xFF000000";
layout_width="match_parent";
{
TextView;
layout_height="match_parent";
textColor="0xFFFFFFFF";
id="logod";
text="登录";
gravity="center";
layout_width="match_parent";
};
};
{
TextView;
layout_alignParentRight="true";
textColor="#ff757575";
text="还没有账号?立刻注册";
onClick=function()
注册页面.setVisibility(View.VISIBLE)
登录页面.setVisibility(View.GONE)
end;
layout_marginTop="20dp";
layout_below="卡片3";
};
};
};
{
CardView;
layout_height="match_parent";
id="注册页面";
layout_width="match_parent";
{
RelativeLayout;
layout_height="match_parent";
padding="20dp";
layout_width="match_parent";
{
CardView;
layout_height="45dp";
id="卡片4";
radius="10dp";
backgroundColor="#DCDCDC";
layout_width="match_parent";
{
EditText;
textColor="0xFF000000";
hintTextColor="0xFF585858";
backgroundColor="0x00ffffff";
id="user1";
hint="请输入账号(5到12位数字)";
InputType='number';
layout_width="match_parent";
};
};
{
CardView;
layout_height="45dp";
id="卡片5";
layout_below="卡片4";
layout_marginTop="20dp";
radius="10dp";
backgroundColor="#DCDCDC";
layout_width="match_parent";
{
EditText;
textColor="0xFF000000";
hintTextColor="0xFF585858";
backgroundColor="0x00ffffff";
id="pass1";
hint="请输入密码";
layout_width="match_parent";
};
};
{
CardView;
layout_height="45dp";
id="卡片6";
layout_below="卡片5";
layout_marginTop="20dp";
radius="10dp";
backgroundColor="#DCDCDC";
layout_width="match_parent";
{
EditText;
textColor="0xFF000000";
hintTextColor="0xFF585858";
backgroundColor="0x00ffffff";
hint="请输入用户名";
id="name1";
layout_width="match_parent";
};
};
{
CardView;
layout_height="45dp";
id="卡片7";
layout_below="卡片6";
layout_marginTop="20dp";
radius="10dp";
backgroundColor="0xFF000000";
layout_width="match_parent";
{
TextView;
layout_height="match_parent";
textColor="0xFFFFFFFF";
text="注册";
id="注册ID";
gravity="center";
layout_width="match_parent";
};
};
{
TextView;
layout_alignParentRight="true";
textColor="#ff757575";
text="已有账号?立刻登录";
onClick=function()
登录页面.setVisibility(View.VISIBLE)
注册页面.setVisibility(View.GONE)
end;
layout_marginTop="20dp";
layout_below="卡片7";
};
};
};
};
{
LinearLayout;
layout_height="match_parent";
layout_width="match_parent";
};
};
activity.setContentView(loadlayout(layout))
-- 上面为布局代码,以下为登录注册的核心代码
local cjson=import "cjson"
admin="512357657" -- 替换为自己水仙后台的账号,也就是qq号
key="9a712a0c17d598d38bdc" -- 替换为自己水仙后台的key,水仙app主页,点击我的后台-->右上角三个点-->修改配置
-- 注册
注册ID.onClick=function()
local url="http://shuixian.ltd/main/api/user/register.php"
-- 请将下面admin和key等于号的内容替换成自己的水仙后台
data="admin="..admin.."&user="..tostring(user1.getText()).."&password="..tostring(pass1.getText()).."&name="..tostring(name1.getText()).."&key="..key
网络模块.提交(url,data,nil,"utf-8",nil,function(code,content,cookie,header)
if code==200 and content then--成功
local JSON=cjson.decode(content)
if JSON.code==1 then
print("注册成功,请在登录页面登录")
登录页面.setVisibility(View.VISIBLE)
注册页面.setVisibility(View.GONE)
else
print("注册失败"..JSON.msg)
end
else
print('网络错误或参数错误')
end
end)
end
-- 登录
logod.onClick=function()
local url="http://shuixian.ltd/main/api/user/login.php"
local data="admin="..admin.."&user="..tostring(user.getText()).."&password="..tostring(pass.getText()).."&key="..key
网络模块.提交(url,data,nil,"utf-8",nil,function(code,content,cookie,header)
if code==200 and content then--成功
local JSON=cjson.decode(content)
if JSON.code==1 then
进入子页面("哔哩哔哩")
else
print("登录失败"..JSON.msg)
end
else
print('网络错误或参数错误')
end
end)
end
2.2. 水仙app配置
- 打开登录开关和注册开关
水仙app主页,点击我的后台-->用户系统-->右上键三个点-->修改配置。
-- 获取管理员账号和key
管理员账号就是注册水仙app的qq号,在我的页面可以查看,如下图:
key获取方式:水仙app主页,点击我的后台-->右上角三个点-->修改配置。请将2.1代码中admin和key替换为自己的水仙后台账号和key,替换后再运行。
三、成果展示
- 注册页面
- 登录页面