源地址:http://tech.ddvip.com/2008-12/1230185531102848.html
教程需求
本教程需要使用如下技术:
带有 Ruby 支持的 NetBeans IDE 6.0
获取 Flickr API Key
您必须有 API Key 才能使用 Flickr API。
打开 web 浏览器,访问 http://www.flickr.com/services/api/misc.api_keys.html。
点击“Apply for your key online now”。
按照步骤获取 Flickr Key。
复制 Flickr 生成的 API Key,并将其保存在文本文件中或其他方便的位置。
安装 Flickr 库
在“工具”菜单中选择“Ruby Gems”。
在“Ruby Gems”对话框中点击“New Gems”选项卡。
在“Search”字段中键入 flickr,然后按 Enter 键。
选择 flickr,然后点击“Install”。在“Installation Settings”对话框中点击“OK”。
确认收到成功的消息,然后关闭对话框。
创建 Ruby on Rails 项目
选择“文件”>“新建项目”。
在“类别”框中选择 Ruby,在“项目”框中选择 Ruby on Rails 应用程序,点击“下一步”。
在“项目名称”字段中键入 flickr,然后单击“完成”。
Flickr 库要求将 Flickr API Key 直接添加至其脚本中。您可以这样做,但下面介绍的方法让您不必如此亦可使用 Flickr 库。
在“项目”窗口中,展开“Configuration”节点,然后打开 environment.rb 文件。
将下列代码添加至 environment.rb 文件最后。确保将您的 Flickr API Key 输入到 MY_KEY 变量中。访问 Flickr API 时需要该 Key。
代码示例 1:添加 Flickr API Key
require 'rubygems'
require 'flickr'
MY_KEY='输入您的 Flicker API Key'
class Flickr
alias old_initialize initialize
def initialize(api_key=MY_KEY, email=nil, password=nil)
puts "new_initialize " + MY_KEY
old_initialize(api_key, email, password)
@host="http://api.flickr.com"
@activity_file='flickr_activity_cache.xml'
end
end
从主菜单中,选择“文件”>“全部保存”。
在项目中添加样式
在“项目”窗口中,展开“Views”节点,右键点击“layouts”节点,然后选择“新建”->“RHTML File”。将文件命名为 application 并点击“完成”。
将 application.rhtml 中的代码替换成如下代码:
代码示例 2:application.rhtml 所需代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Flickr</title>
<%= javascript_include_tag :defaults %>
<%= stylesheet_link_tag 'flickr' %>
</head>
<body>
<%= yield %>
</body>
</html>
展开“Public”节点,右键点击“sylesheets”,然后选择“新建”>“其他”。
在“新建文件”对话框中,设置“类别”为“其他”,“文件类型”为“层叠样式表”。点击“下一步”。
将文件命名为 flickr 并点击“完成”。
文件 flickr.css 会在编辑区打开。
将如下样式添加到 flickr.css 中:
代码示例 3:样式代码
body {
background-color: #888;
font-family: Lucida Grande;
font-size: 11px;
margin: 25px;
}
form {
margin: 0;
margin-bottom: 10px;
background-color: rgb(222,231,236);
border: 5px solid #333;
padding: 25px;
}
fieldset {
border: none;
}
#spinner {
float: right;
margin: 10px;
}
#photos img {
border: 1px solid #000;
width: 75px;
height: 75px;
margin: 5px;
}
创建控制器
右键点击“Controllers”节点,然后选择“Generate”。
在“Rails Generator”对话框中,“Name”字段输入 flickr,“Views”字段输入 index,然后点击“OK”。
该操作会生成文件 flickr_controller.rb,并将其在编辑区打开。
展开“Views”>“flickr”,然后打开 index.rhtml。
将 index.rhtml 中的代码替换成如下代码:
代码示例 4:index.rhtml 所需代码
<% form_remote_tag :url => {:action => 'search'}, :update => 'photos' do %>
<fieldset>
<label for="tags">Tags:</label>
<%= text_field_tag 'tags' %>
<%= submit_tag 'Find' %>
</fieldset>
<div id="photos"></div>
<% end %>
定义搜索方法
打开 flickr_controller.rb。
编缉代码,删除 index 方法,并将其替换成 search 方法,如下面 粗体所示:
代码示例 5:代码 FlickrController 类
class FlickrController < ApplicationController
def search
flickr = Flickr.new
if params[:tags].empty?
render :text => '<h2>Please enter a search string</h2>'
else
begin
photos = flickr.photos(:tags => params[:tags], :per_page => '24')
render :partial => 'photo', :collection => photos
rescue NoMethodError
render :text => '<h2>No matching photos found</h2>'
end
end
end
end
在“Views”节点中,右键点击“flickr”节点,然后选择“新建”->“RHTML File”。将文件命名为 _photo 并单击“完成”。
替换文件内容,使其仅包含如下一行:
<img class='photo' src="<%= photo.sizes[0]['source'] %>">
运行应用程序
此步配置环境使运行项目即启动应用程序。
在“Public”节点中,删除 index.html。
在“Configuration”节点中,打开 routes.rb。查找行:
# map.connect '', :controller => "welcome"
编缉该行,删除注释符号(#),并将 welcome 改为 flickr。
点击工具栏中的“运行主项目”按钮启动 WEBrick 服务器,并打开浏览器,如下图所示。
图 1:flickr 应用程序
使用 Rails 构建 Flickr 应用
输入搜索字符串,例如 NetBeans,然后点击“Find”。加载图片需要几秒钟。
图 2:加载图片
使用 Rails 构建 Flickr 应用
改进用户体验
当您点击“Find”按钮时,操作是在后台执行,不会出现任何反馈。此步将添加一个简单的动画 gif 帮助解决该问题,并更改图片加载时的显示效果。
将此动画 gif 使用 Rails 构建 Flickr 应用 从浏览器保存到桌面文件。然后拖曳文件到 NetBeans IDE“项目”窗口中的“Public”>“images”节点下。
打开“Views”>“flickr”> index.rhtml。删除已有代码,并使用下面示例中给出的代码将其替换:
代码示例 6:index.rhtml 所需代码
<% form_remote_tag :url => {:action => 'search'}, :update => 'photos',
:complete => visual_effect(:blind_down, 'photos'),
:before => %(Element.show('spinner')),
:success => %(Element.hide('spinner')) do %>
<%= image_tag 'spinner.gif', :id => 'spinner', :style => 'display: none' %>
<fieldset>
<label for="tags">Tags:</label>
<%= text_field_tag 'tags' %>
<%= submit_tag 'Find' %>
</fieldset>
<div id="photos" style="display: none"></div>
<% end %>
从主菜单中,选择“文件”>“全部保存”。刷新浏览器,然后尝试其他的搜索字符串,例如 JRuby。
图 3:添加动画
使用 Rails 构建 Flickr 应用
现在您可以看到一个简单的动画,让您了解服务器正在处理您的请求。而当图片出现时,好像拉下一组百叶窗扇的感觉。
分享到:
相关推荐
" 提示我们这是一个全栈开发项目,目的是构建一个类似于著名图片分享平台Flickr的应用程序。在全栈开发中,我们需要掌握前端和后端技术,实现用户界面、数据处理、服务器通信等功能。这个项目可能是为了学习目的,也...
本书主要介绍了如何使用Ruby来克隆四种流行的互联网应用——TinyURL、Twitter、Flickr和Facebook,并通过这些项目帮助读者深入了解Ruby在实际Web开发中的应用。 ##### 1. TinyURL **TinyURL**是一个网址缩短服务,...
1. **Ruby on Rails框架**:作为Ruby的主要Web开发框架,Rails提供了MVC(模型-视图-控制器)架构,简化了Web应用的构建过程。开发者可能使用它来处理路由、数据库交互、模板渲染等核心功能。 2. **数据库设计**:...
基于arm64版本的docker-compose文件
台区终端电科院送检文档
埃夫特机器人Ethernet IP 通讯配置步骤
rv320e机器人重型关节行星摆线减速传动装置研发
气缸驱动爬杆机器人的设计().zip
56tgyhujikolp[
内容概要:本文档提供了基于OpenCV的数字身份验证系统的Python代码示例,涵盖人脸检测、训练和识别三个主要功能模块。首先,通过调用OpenCV的CascadeClassifier加载预训练模型,实现人脸检测并采集多张人脸图像用于后续训练。接着,利用LBPH(局部二值模式直方图)算法对面部特征进行训练,生成训练数据集。最后,在实际应用中,系统能够实时捕获视频流,对比已有的人脸数据库完成身份验证。此外,还介绍了必要的环境配置如依赖库安装、文件路径设置以及摄像头兼容性的处理。 适合人群:对计算机视觉感兴趣的研发人员,尤其是希望深入了解OpenCV库及其在人脸识别领域的应用者。 使用场景及目标:适用于构建安全认证系统的企业或机构,旨在提高出入管理的安全性和效率。具体应用场景包括但不限于门禁控制系统、考勤打卡机等。 其他说明:文中提供的代码片段仅为基本框架,可根据实际需求调整参数优化性能。同时提醒开发者注意隐私保护法规,合法合规地收集和使用个人生物识别信息。
内容概要:本文档详细介绍了Java并发编程的核心知识点,涵盖基础知识、并发理论、线程池、并发容器、并发队列及并发工具类等方面。主要内容包括但不限于:多线程应用场景及其优劣、线程与进程的区别、线程同步方法、线程池的工作原理及配置、常见并发容器的特点及使用场景、并发队列的分类及常用队列介绍、以及常用的并发工具类。文档旨在帮助开发者深入理解和掌握Java并发编程的关键技术和最佳实践。 适合人群:具备一定Java编程经验的研发人员,尤其是希望深入了解并发编程机制、提高多线程应用性能的中级及以上水平的Java开发者。 使用场景及目标:①帮助开发者理解并发编程的基本概念和技术细节;②指导开发者在实际项目中合理运用多线程和并发工具,提升应用程序的性能和可靠性;③为准备Java技术面试的候选人提供全面的知识参考。 其他说明:文档内容详尽,适合用作深度学习资料或面试复习指南。建议读者结合实际编码练习,逐步掌握并发编程技巧。文中提到的多种并发工具类和容器,均附有具体的应用场景和注意事项,有助于读者更好地应用于实际工作中。
这个数据集包含了日常步数统计、睡眠时长、活跃分钟数以及消耗的卡路里,是个人健康与健身追踪的一部分。 该数据集非常适合用于以下实践: 数据清洗:现实世界中的数据往往包含缺失值、异常值或不一致之处。例如,某些天的步数可能缺失,或者存在不切实际的数值(如10,000小时的睡眠或负数的卡路里消耗)。通过处理这些问题,可以学习如何清理和准备数据进行分析。 探索性分析(发现日常习惯中的模式):可以通过分析找出日常生活中的模式和趋势,比如一周中哪一天人们通常走得最多,或是睡眠时间与活跃程度之间的关系等。 构建可视化图表(步数趋势、睡眠与活动对比图):将数据转换成易于理解的图形形式,有助于更直观地看出数据的趋势和关联。例如,绘制步数随时间变化的趋势图,或是比较睡眠时间和活动量之间的关系图。 数据叙事(将个人风格的追踪转化为可操作的见解):通过讲述故事的方式,把从数据中得到的洞察变成具体的行动建议。例如,根据某人特定时间段内的活动水平和睡眠质量,提供改善健康状况的具体建议。
资源内项目源码是来自个人的毕业设计,代码都测试ok,包含源码、数据集、可视化页面和部署说明,可产生核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,毕设答辩评审绝对信服的保底85分以上,放心下载使用,拿来就能用。包含源码、数据集、可视化页面和部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.txt文件,仅供学习参考, 切勿用于商业用途。
nginx
资源内项目源码是来自个人的毕业设计,代码都测试ok,包含源码、数据集、可视化页面和部署说明,可产生核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,毕设答辩评审绝对信服的保底85分以上,放心下载使用,拿来就能用。包含源码、数据集、可视化页面和部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.txt文件,仅供学习参考, 切勿用于商业用途。
资源内项目源码是来自个人的毕业设计,代码都测试ok,包含源码、数据集、可视化页面和部署说明,可产生核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,毕设答辩评审绝对信服的保底85分以上,放心下载使用,拿来就能用。包含源码、数据集、可视化页面和部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.txt文件,仅供学习参考, 切勿用于商业用途。
模拟知识付费小程序,可流量主运营模式
什么是普通上传 调用接口一次性完成一个文件的上传。 普通上传2个缺点 文件无法续传,比如上传了一个比较大的文件,中间突然断掉了,需要重来 大文件上传太慢 解决方案 分片上传
英二2010-2021阅读理解 Part A 题干单词(补).pdf
2023-04-06-项目笔记-第四百五十五阶段-课前小分享_小分享1.坚持提交gitee 小分享2.作业中提交代码 小分享3.写代码注意代码风格 4.3.1变量的使用 4.4变量的作用域与生命周期 4.4.1局部变量的作用域 4.4.2全局变量的作用域 4.4.2.1全局变量的作用域_1 4.4.2.453局变量的作用域_453- 2025-04-01