谷歌/Google
简单!10分钟搞定一款APP,图文完整详细教程
2024-10-18 09:04

简单!10分钟搞定一款APP,图文完整详细教程

生活在这个互联网高速发展的时代,现在几乎人手一部智能手机,为什么智能手机可以这样火了?很大原因是因为它有很多好玩的手机应用软件。安卓手机在市场占据着重要的地位,使得安卓APP开发热度不减,随着市场的需求不断发展,安卓APP开发的市场也会越来越广阔

安卓APP开发市场这么旺盛,作为普通人,既不会编程又不会设计怎样才能开发一款自己的APP呢?

今天为大家介绍一个不用学编程,只要会简单的图片处理技术和排版设计就可以自己制作APP的神器

注:文章结尾附我个人做的APP录制视频,一个功能很简单的一个APP,大家简单了解一下。

电脑百度搜索 应用公园官网 注册一个应用公园的账号

进入应用公园官网,点击右上方免费注册(红框)

输入邮箱地址,登录邮箱,点击应用公园发送的链接。

填写昵称和密码,点击确认。然后点击立即制作应用

下面进入应用的制作界面,首先要有3种模式:

1.主题模式

2.自由模式

3.一键模式(暂未开放)

主题模式分为几种类型:商业、生活、旅游、摄影录像、健康健美、娱乐

选择一项,这里我们选的是摄影录像-快乐成长,然后点击下一步

进入应用的基本设置界面:您打算为自己的第一个应用起个什么名字呢?您应用的要有什么样的图标?还有应用的启动界面?

应用图标在设计时,一般建议设计尺寸为:114px*114px。(如果您需要将应用上架到app store苹果应用商店及其他应用市场的话,就可能会需要用到尺寸为1024px*1024px的图标)

告诉大家一下,应用的图标及名称一旦确定后,如果再次进行修改,需要用户重新下载应用,无法通过内容更新来改变。所以,大家在正式发布之前一定要确定好应用的图标。

点击上传图标中的选择图片 选择图片有两种方式,一是自己上传图片(自己上传图片注意图片尺寸,可用美图秀秀裁成对应的尺寸);二是使用系统图片

系统图片可直接使用,有图标、背景、按钮、顶部导航、底部导航、电商

图片选择完成后点击 保存&制作,进入应用操作界面,左侧是应用页面1688批发网,右侧是操作页面。操作页面有:控件、控件属性、页面属性、已有导航四项。控件里还有基础控件、高级控件、我的模板;

控件属性。可修改文章内容、标题、图片编辑等等

控件样式可修改文章字体大小、颜色、背景、文字位置等

大家可以进入应用公园官网简单的了解一下界面操作

下面为大家带来基础控件的使用方法

文本控件是用于在APP页面上添加文字的。这个控件一般是填写标题或较少文字时使用。

1)拖动文本控件到模拟器后,点击它,右侧控件属性栏会切换成当前控件属性,在“控件属性”——“控件内容”中填写所需文字内容,在“控件属性”——“控件样式”为其设置字体大小、颜色、对齐方式和粗细。

2)模拟器中会实时模拟出文本的显示效果,保存后生效。(建议将文本控件的高度和宽度设置的相对于文字本身高度计宽度要大一点,不然在部分手机上会存在文字显示不全的问题。)

多行文本控件支持文字换行和空格操作,设置字体、颜色和背景等,可用于多段文字的排版使用,且占用资源较小。

1)拖动多行文本控件到模拟器后,点击它,右侧在“控件属性”——“控件内容”中填写所需文字内容,在“控件属性”——“控件样式”为其设置字体大小、颜色、对齐方式和粗细。

可输入最多5000字的内容简单!10分钟搞定一款APP,图文完整详细教程,支持换行,空格操作。

2)点击背景后上传按钮,可为该控件区域设置背景,可选纯色背景,或上传一张图片作为背景。如果多行文本下方无其他控件了,可以点选“自适应高度”,显示效果更佳。

大家可以结合图片一起了解

可以在APP页面上展示一张图片,还可以设置点击效果和跳转链接。

1)拖动图片控件到模拟器后,点击它,右侧“控件属性”——“控件内容”栏内出现图片缩略框,点击它,进入图片库面板,可选系统素材,或切换至“我的图片”从本地选择图片上传后,选择完图片后点击“确定”,该图片将显示在模拟器中。“控件属性”——“控件样式”中设定图片控件尺寸大小。PS:自己上传的图片还有剪切功能如何设置谷歌缩略图,可在图库中直接剪裁成任意尺寸覆盖原图或另存为新素材使用。图片库现在已经支持创建文件夹来管理“我的图片”。

2)图片下方的点击事件模块,可设置点击该图片后触发的行为。选择“显示大图”并设置好另一张图片,可在手机客户端上点击原图片时展开另一张图片。

选择“链接”链接至页面,可在下拉框中选择返回上一页/首页或链接到任意页面,点击图片时则跳转到该页面。

选择“调用功能”,可选打电话/发短信/定位功能,选择后可在下方编辑电话号码或经纬度,用户点击图片时便可直接打电话,发短信给预置号码,也可不设置号码,将短信内容设置为统一形似,由用户自己去决定分享给谁,或调用手机中的地图软件查看你预置的地点位置。

使用地图定位就需要按照制作页面上面的要求,将一个地点获取到的谷歌地图经纬度和百度地图经纬度分别填入输入框内,不能混填,也不能只填一个。、

以下是谷歌和百度地图经纬度的获取地址,大家可点击查看。

谷歌经纬度获取地址:

百度经纬度获取地址:

APP页面中的按钮控件,用来控制点击后跳转至某个页面。一个页面中可使用多个按钮来控制跳转到不同的页面。

1)拖动一个按钮控件到模拟器,点击它,在右侧“控件属性”——“控件内容”栏中为它命名,来代表这个按钮的含义,例如“返回上一页”,“查看图片”等。在“控件属性”——“控件样式”栏可自行设置按钮文字的大小,颜色,粗细,及按钮背景图片。

2)在背景栏可为按钮设置个性化的背景图片,点击上传进入图片库面板,可选系统背景素材,或切换至“我的图片”从本地上传图片后点击“确定”,该背景图将显示在模拟器中。PS:自己上传的图片还有剪切功能,可在图库中直接剪裁成任意尺寸覆盖原图或另存为新素材使用。

3)为按钮设置链接,选择“链接页面”(可在下拉框中选择返回上一页/首页或链接到任意页面,点击按钮时则跳转到该页面)或选择“调用功能”,可选打电话/发短信/定位功能,选择后可在下方编辑电话号码或经纬度,用户点击图片时便可直接打电话,发短信给预置号码,也可不设置号码,将短信内容设置为统一形似,由用户自己去决定分享给谁,或调用手机中的地图软件查看你预置的地点位置。

用于在APP页面中播放声音文件,一个音频控件内只可包含一个不超过10M的MP3格式音频。一个页面可使用多个音频控件来播放多个音频,但需注意过多音频可能会导致应用的加载和运行迟缓。

1)点击模拟器中的音频控件,在右侧控件属性栏中点击“选择音频”本地上传音频文件,确认后该控件即包含了该音频。请注意目前音频控件仅支持mp3格式文件且需在10M以内。

2)点击下方的缩略图,可自定义设置音频播放和暂停状态时的图标。上传后确认后可在模拟器中查看效果并作出调整。

用于在APP页面中播放视频文件,支持在线视频播放(目前支持优酷/腾讯视频)。一般一个页面内建议只使用一个视频控件,否则可能导致页面出现加载缓慢或卡死现象。

1)拖动一个视频控件到模拟器,点击它,在右侧控件属性栏中输入优酷/腾讯视频的ID号即可。点击“上传封面”,可自定义设置视频控件的背景图片,在视频未播放时显示。可在模拟器中可查看效果并作出调整。

使用浏览器控件可预先内置一个网页地址,让用户打开本页时直接打开浏览器进入该网址浏览。

将浏览器控件拖入模拟器,点击它,在右侧滑出的“控件属性”——“控件内容”内对其进行具体编辑。首先输入一个预设网址,用户使用时便可直接浏览该网页。选择是否显示导航,来决定该浏览器是否在底部显示“前进”、“后退”、“打开设备自带浏览器”和“刷新”按钮。

通常用作菜单页,可将多样化的内容做分类索引,点击每一栏列表对应进入该项具体内容。一个列表控件内可自由添加多栏列表,但不建议同一个页面内添加多个列表控件。

1)将列表控件拖入模拟器,点击它,便可在右侧的“控件属性”内对其进行具体编辑。

2)首先在“控件属性”——“控件样式”中,可以选择快速布局和样式,布局是指列表的排列格局,有左图右文普通列表和上图下文图片列表。快速样式是指列表色系,有灰黑蓝紫橙5色可选。你可以分别选择它们在模拟器中查看效果后决定使用哪种布局和样式,也可以自己在下方的背景、行背景及间隔设置框内进行自定义设置。同时可在此页面设置标题/内容文字的大小、颜色、粗细,此项设置将对该控件内的所有列表栏生效。如果您的App需适应多分辨率的手机,可勾选“高度自适应”选项,自动拉伸控件匹配不同屏幕的高度。

4) 在“控件属性”——“控件内容”中,点击下方的“添加”按钮,根据需要为本控件添加多个列表栏。点击已添加的每一栏列表可展开编辑框,对本栏进行标题/副标题的编辑、选择链接页面(点击该栏后跳转至该页面)或调用功能(可以预设电话号码和短信内容让用户直接拨打回复,以及添加定位地点,使用时直接调用地图定位),设置列表左侧缩略图,编辑好后可在模拟器中查看效果进行调整。

通常用作菜单页,可将多样化的内容做分类索引,点击每个宫格对应进入该项具体内容。一个宫格控件内可自由添加多个宫格。

将宫格控件拖入模拟器,点击它,便可在右侧滑出的控件属性内对其进行具体编辑。

首先在“控件属相”——“控件样式”中可以选择快速布局和样式,布局是指宫格的排列格局,有上图下文普通宫格,zaker色块宫格(每一个宫格都可以单独设置背景色)和文字叠加在图片下方宫格3种。样式是指宫格的色系,有灰黑蓝紫橙5色可选。你可以分别选择它们在模拟器中查看效果后决定使用哪种布局和样式。往下可为宫格下方的文字设置大小、颜色、粗细,此项设置将对该控件内的所有宫格生效。

最下方可设置背景(整个宫格控件框的背景),可选纯色背景或自定义本地上传。接着可编辑宫格栏的参数,列数是指每一行显示多少个宫格;列间距和行间距指每列/每行宫格之间的距离;外边距指宫格与控件框边缘之间的距离;输入数值或上下加减可对这几项数据进行设置;

如果您的App需适应多分辨率的手机,可勾选“高度自适应”选项,自动拉伸控件匹配不同屏幕的高度。

“控件属相”——“控件内容”中的“新建”按钮,根据需要为本控件添加多个宫格。

点击已添加的每个宫格可展开编辑框,对该宫格进行名称命名、编辑图标和选择链接页面(点击该宫格后跳转至该页面),或调用功能(可以预设电话号码和短信内容让用户直接拨打回复,以及添加定位地点,使用时直接调用地图定位)。想要增加宫格个数时,点击“新建”即可。

可用于展示一系列图片,可设置好时间自动播放取得类似动画的效果。

首先要在“控件属性”——“控件内容”中上传需要展示的图片,上传图片一般建议尺寸应该保持一致,并且画廊的长宽应该和图片实际尺寸保持正比关系。图片单张控制在150KB以内。

在线获取:勾选该选项后,画廊内的图片图片就只能在联网状态下才能查看。

优点:图片直接存于服务器,不会被打入应用的安装包中,精简应用大小。

缺点:不联网时无法查看。

画廊共有3种不同形式的展现方式,通过“控件属性”——“控件样式”——“快速布局”设置。

画廊一:单图普通画廊(可做图库,并且可以将图片保存到手机)。

画廊二:图文画廊(支持链接到其他页面)。

画廊三:三图画廊(支持链接到其他页面)。

接下来,选择是否显示页码,选“是”则图片上将出现该图片的序号。选择是否自动播放,“是”则在手机中浏览该页时自动播放这一组图片,“否”则手动操作逐张浏览。

接着设置播放的速度,默认1000毫秒=1秒,该时间是指整组图片播放的时间,你可以自由调整。

画廊控件设置纯色背景或自定义上传背景,在未被图片覆盖的区域显示。

画廊二及画廊三的链接方法(画廊一不支持链接):

首先确保在画廊二或者画廊三的状态下,在“控件属性”——“控件内容”中点击需要链接的单张图片,然后在下方添加文字内容,最终在“页面”选项中,选择需要链接的页面。这样当用户点击这张图片后,就可以跳转到您设置好的页面中了。

可以链接多个页面,实现各页面平级切换的效果,在我们制作App时经常作为做菜单使用。不过对标签的设计很多同学却把握不准尺寸和效果,下面来跟大家分享几点,底部标签的制作技巧。

一、计算好标签的尺寸

一般建议设计标签导航条的总宽度是640像素(制作页面中控件属性数值设置的宽度最大为320,因此可以得出图片的实际尺寸应该是在制作页面设置数值的2倍),所以你要做多少个标签,决定了每个标签的宽度是多少,例如添加4个标签,那么每个标签的宽度就是640/4=160像素。假如你要做5个标签的话,那就是640/5=128像素,以此计算即可。标签的高度只要一致就可以,但也要适中,一般在50—100像素之间效果最佳。这里用的是98像素(制作页面中控件属性数值设置的高度就该为49),你也可以自己设计的实际高度加高或者调低一些。

二、每个标签制作2种效果用于切换

我们在手机中点击按钮,按下时都会有切换效果,这里也不例外哦,标签导航允许分别设置【点击前】和【点击后】的效果。所以我们就按照步骤一计算好的尺寸(128×98像素),为每个标签制作2张小图,如下图所示如何设置谷歌缩略图,点击前的标签按钮图片都是灰色,点击后每个选项的上方都出现了一个白色的三角形,这样在手机中里点击时效果就比较明显了。具体图片制作方法这儿不说了,大家用简单搞定(实在不会的同学可以去下载一些对比明显的素材图裁剪成对应尺寸也可以哦)。做好这10张小图后将它们上传到图片库里,然后在控件属性栏中分别设置每个标签的【图片】和【按下图片】。因为这里的标签按钮我们已经在图片上做好文字了,所以要把“文字显示”去掉。如果图片上没有文字,可以自己输入。

到这一步,这个底部标签就做好了,在模拟器中点击它们,可以看到点击前和点击后的效果~

基础控件的教程就到这里,大家看不完可以先收藏文章,有闲暇时间的时候可以翻出这篇文章,去应用公园官网边看边做一个APP

可以做一个表白APP哦~~~~女生看到专属于她的APP,肯定会对你充满好感、钦佩。

最后为大家送上我个人做的APP,很菜很简单

基础控件中用了文字控件、多行文本控件、图片控件、按钮控件、视频控件、列表控件、宫格控件、画廊控件、底部标签导航控件。

供大家简单了解一下吧

制作过程

制作过程

安装后的应用(右下角行和APP)

【本文来源于互联网转载,如侵犯您的权益或不适传播,请邮件通知我们删除】

发表评论
0评