童程童美少儿手机编程教程-快来制作自己的独家相册

手机里有许许多多的有用小工具,其中相册应该是我们最常用的工具了,电子相册各式各样,不同手机的相册不尽相同,今天呢,小童老师就教小朋友做一款简单精美的手机小相册——“独家相册”,这个相册有点像我们的QQ空间的相册浏览。小朋友可以把自己最最喜欢的相片们上传到这个“独家相册”中哦!

童程童美少儿手机编程教程-快来制作自己的独家相册

界面设计

先来看看小童老师的“独家相册”吧!

童程童美少儿手机编程教程-快来制作自己的独家相册

从图中我们可以看出,界面分为两部分——相片展示区和相片浏览区。

1

相片展示区

我们主要是用一个精灵组件来展示相片的。之所以用精灵来展示相片,而不用图片组件,是因为我们要在精灵的空间上方,加一个“上一张精灵”和“下一张精灵”两个组件来帮助我们浏览相册,图片组件上不能重叠放置其他组件哦~

这里我们需要一个画布,三个精灵:相片精灵、上一张精灵、下一张精灵。

童程童美少儿手机编程教程-快来制作自己的独家相册

相片精灵设置好合适的宽高及X、Y的值。

上一张精灵和下一张精灵分别移到画布的左中位置和右中位置,并隐藏允许显示。

注:设置它们的Z值为2.0,这样可以让这两个精灵位于相片精灵的上一层。

2

相片浏览区

相片浏览区设计比较简单,就是一个水平滚动布局和N个水平布局和按钮,这N个按钮的宽高可以根据喜好调节大小,水平布局的宽高比按钮的稍大一点点。老师这里的按钮的宽高分别是:80、100,水平布局的宽高分别是:90、110,占位标签的宽度为:2 。

童程童美少儿手机编程教程-快来制作自己的独家相册

然后为这几个按钮的图片上传照片,这些照片就是相册的相片们,大家不要忘了给相片精灵设置图片为第一个按钮的图片哦。

代码设计

1) 相片存储到列表中,用一个数字来标记相片精灵展示的相片在列表中的对应项。点击浏览区的图片按钮,展示该图片。

童程童美少儿手机编程教程-快来制作自己的独家相册

注意:列表中的one.png、two.png等等是老师的相册相片,小朋友可以换成自己的图片哦!

2)触摸画布时显示“上一张精灵”和“下一张精灵”,点击“上一张精灵”按图片列表的顺序展示上一张相片,点击“下一张精灵”展示下一张相片。

童程童美少儿手机编程教程-快来制作自己的独家相册

以上就是本次“独家相册”的全部代码啦,是不是很简单呢,小朋友们不如偷偷做个好看的相册,安装到爸爸妈妈手机里,给他们一个小惊喜吧。

童程童美少儿手机编程课程,面向10岁以上孩子,通过逻辑测试的零基础或一定编程基础的适龄儿童。采用Java语言和专业开发工具进行教学,由浅入深、系统化的教授如何开发在Android移动设备上使用的手机应用和游戏。课程设计趣味感强,游戏主题贯穿其中。在学习中锻炼孩子的逻辑思维能力、培养兴趣、提高孩子的专注力、提升孩子的严谨性和抗挫能力。课程学习后,能够学以致用,使学习和生活相结合,让孩子获得成就感。


分享到:


相關文章: