本市天气(百度定位与车联网之天气查询)(三)

简介: 本市天气(百度定位与车联网之天气查询)(三)

6.渐变动画和缩放动画


我们打开网易新闻APP,我们发现它是渐变出现的,并且,当整个布局出现后,布局中的六个按钮才开始缩放。


下面我们看看渐变动画的代码:


这个是渐变显示weather_layout_alpha_show_anim.xml的代码:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:duration="500"
        android:fromAlpha="0.0"
        android:toAlpha="1.0"/>
</set>


这个是渐变隐藏weather_layout_alpha_hide_anim.xml的代码:

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:duration="500"
        android:fromAlpha="1.0"
        android:toAlpha="0.0"/>
</set>


一个是从开始没有到有,一个是从有到没有。


按钮的缩放动画weather_layout_scale_anim.xml如下:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:duration="500"
        android:startOffset="500"
        android:fillAfter="false"
        android:fromXScale="0.0"
        android:toXScale="1.1"
        android:fromYScale="0.0"
        android:toYScale="1.1"
        android:pivotX="50%"
        android:pivotY="50%"/>
</set>

解释:


①因为按钮缩放动画是布局渐变动画后才开始动画的所以添加了android:startOffset="500"在渐变动画半秒执行完成后,缩放动画立即执行。


②因为按钮缩放动画都缩放为原来大小的1.1倍,所以当动画执行完成后,要恢复按钮原来的大小也就是1.0,所以android:fillAfter="false"。


③pivotX="50%",pivotY="50%",从自己的中间部分开始缩放,默认是从控件左上角(0,0)开始缩放的。如果不设置这个属性,就和网易客户端的动画不同了。


下面是执行动画了,这里有上篇文章讲解的一个动画漏洞,还请认真阅读一下。


NewsFragment.class添加天气的成员变量:

//天气代码片段
private LinearLayout weatherLayout;//天气界面整体布局
//六个按钮
private LinearLayout weatherSearchLayout;
private LinearLayout weatherHeadlineLayout;
private LinearLayout weatherOfflineLayout;
private LinearLayout weatherThemeLayout;
private LinearLayout weatherScanLayout;
private LinearLayout weatherInvitationLayout;
//显示和隐藏天气界面的按钮,也就是标题栏上面的三个点
private ImageButton weatherBut;
//标记界面是显示还是隐藏,使按钮点击显示和关闭
private boolean weatherDialogFlag = false;


接着在onCreateView()方法中添加如下代码:


//天气代码片段
this.weatherLayout = (LinearLayout) view.findViewById(R.id.weather_layout_main);
this.weatherSearchLayout = (LinearLayout) view.findViewById(R.id.weather_layout_search);
this.weatherHeadlineLayout = (LinearLayout) view.findViewById(R.id.weather_layout_headline);
this.weatherOfflineLayout = (LinearLayout) view.findViewById(R.id.weather_layout_offline);
this.weatherThemeLayout = (LinearLayout) view.findViewById(R.id.weather_layout_theme);
this.weatherScanLayout = (LinearLayout) view.findViewById(R.id.weather_layout_scan);
this.weatherInvitationLayout = (LinearLayout) view.findViewById(R.id.weather_layout_invitation);
this.weatherBut = (ImageButton) view.findViewById(R.id.weather);
final Animation alphaShow = AnimationUtils.loadAnimation(getActivity(), R.anim.weather_layout_alpha_show_anim);
final Animation alphaHide = AnimationUtils.loadAnimation(getActivity(), R.anim.weather_layout_alpha_hide_anim);
final Animation scaleAnim = AnimationUtils.loadAnimation(getActivity(), R.anim.weather_layout_scale_anim);
this.weatherBut.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        if (weatherDialogFlag == false) {
            weatherLayout.setAnimation(alphaShow);
            alphaShow.start();//显示天气界面
            weatherLayout.setVisibility(View.VISIBLE);
            weatherDialogFlag = true;//标记界面已经显示
            //立即执行按钮缩放动画
            weatherSearchLayout.startAnimation(scaleAnim);
            weatherHeadlineLayout.setAnimation(scaleAnim);
            weatherOfflineLayout.startAnimation(scaleAnim);
            weatherThemeLayout.startAnimation(scaleAnim);
            weatherScanLayout.startAnimation(scaleAnim);
            weatherInvitationLayout.startAnimation(scaleAnim);
            showWeather(view);
        } else {
            weatherLayout.setAnimation(alphaHide);
            alphaHide.start();//执行渐变隐藏动画
            weatherLayout.setVisibility(View.GONE);
            weatherDialogFlag = false;//标记界面没有显示
        }
    }
});


这里界面动画使用的是setAnimation与Animation.start()而按钮使用的是startAnimation();你可以把按钮的换成前面那种方法,你会发现,打开关闭界面后,按钮渐变动画只执行一次后就不会在执行了。而上面那个渐变动画却可以执行,这是为什么呢?


下面我们按住Ctrl点击setAnimation进去该方法中,得到如下图所示的信息:


16.png


这个执行是有条件的,当屏幕打开时,会导致动画开始。也就是说start()出来的动画执行是有前提条件的。


所以当我们需要反复执行动画,或者说,你想立即动画就有效果的话,就优先使用startAnimation()方法吧。


7.设置天气界面


我们查看日志,看看我们获取的天气格式:


18.png

在看看网易的天气界面:


19.png

大21是当前温度,也就是日志里面的实时。怎么获取实时温度,字符串截取算法就可以完成,而且时间是截取该实时括号前面的部分。


在就是PM2.5后面的轻度污染。


这个判断一下大小也就可以了。


得到如下代码:

private void showWeather(View view) {
    TextView temperatureTxt = (TextView) view.findViewById(R.id.weather_layout_temperature);
    TextView weatherWindTxt = (TextView) view.findViewById(R.id.weather_layout_weatherwind);
    TextView dateTxt = (TextView) view.findViewById(R.id.weather_layout_date);
    TextView pmTxt = (TextView) view.findViewById(R.id.weather_layout_pm);
    TextView locationTxt = (TextView) view.findViewById(R.id.weather_layout_location);
    ImageView oneImages = (ImageView) view.findViewById(R.id.weather_layout_current_one_image);
    ImageView twoImages = (ImageView) view.findViewById(R.id.weather_layout_current_two_image);
    SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(getActivity());
    temperatureTxt.setText(prefs.getString("temperature", ""));
    weatherWindTxt.setText(prefs.getString("weather", "") + " " + prefs.getString("wind", ""));
    String desc=null;
    if(prefs.getString("pm","")!=""){
        int number=Integer.valueOf(prefs.getString("pm",""));
        if(number<=35){
            desc="优质空气";
        }else if(number<=75){
            desc="无污染";
        }else if(number<=115){
            desc="轻度污染";
        }else if(number<=150){
            desc="中度污染";
        }else if(number<=250){
            desc="重度污染";
        }else if(number<=115){
            desc="严重污染";
        }
        pmTxt.setText(prefs.getString("pm", "")+"    "+desc);
    }
    locationTxt.setText(prefs.getString("current_city", ""));
    if (prefs.getString("current_date", "") != "") {
        String str = prefs.getString("current_date", "");
        int index = str.indexOf(")");
        String currentTemp = str.substring(index - 3, index - 1);//截取实时温度
        index = str.indexOf("(");
        String currentDate = str.substring(0, index - 1);//截取实时温度前面的时间
        dateTxt.setText(currentDate);
        char c1 = currentTemp.charAt(0);//截取两位数温度的第一位数
        char c2 = currentTemp.charAt(1);//截取两位数温度的第二位数
        for (int i = 0; i < 10; i++) {
            if (String.valueOf(i).equals(String.valueOf(c1))) {//比较温度等于哪个数字
                oneImages.setBackgroundResource(imageRes[i]);
            }
            if(String.valueOf(i).equals(String.valueOf(c2))){//与上解释同理
                twoImages.setBackgroundResource(imageRes[i]);
            }
        }
    }
}


其中imageRes是下面运行截图中0-9的数字图片。这个方法将在打开天气界面的时候调用。


这里为什么用局部变量,其原因很简单,java回收机制,局部变量是回收最快且最迅速的,当方法执行完成之后,局部变量就会被回收,避免资源浪费。


从SharedPreference文件中获取天气信息。根据实时温度设置大的图片温度。那么天气界面部分代码就在这里完成了。


因为要离开两个星期,所以天气图片并没有设置,有兴趣的同学自己拷贝网易反编译后的天气图片进行设置,尽量不要获取百度的天气图片,能从本地获取的图片,尽量从本地获取,节约系统资源。


下一篇博文将在两到三个星期后的某个时间更新。



本文的源代码在:


http://download.csdn.net/detail/liyuanjinglyj/9231921


查看运行的结果:

20.png

相关文章
|
6月前
|
缓存 API 定位技术
使用Python调用百度地图API实现地址查询
使用Python调用百度地图API实现地址查询
378 0
|
定位技术 API 开发工具
Android 按照步骤接入百度地图API,定位显示不了解决办法
Android 按照步骤接入百度地图API,定位显示不了解决办法
378 1
|
数据可视化 定位技术 API
百度地图开发:海量点、测距以及定位聚合功能
百度地图开发:海量点、测距以及定位聚合功能
306 0
|
JavaScript 前端开发 API
python对接API二次开发高级实战案例解析:百度地图Web服务API封装函数(行政区划区域检索、地理编码、国内天气查询、IP定位、坐标转换)
python对接API二次开发高级实战案例解析:百度地图Web服务API封装函数(行政区划区域检索、地理编码、国内天气查询、IP定位、坐标转换)
443 0
|
移动开发 小程序 JavaScript
微信小程序学习实录6(百度经纬度采集、手动调整精度、H5嵌入小程序、百度地图jsAPI、实时定位、H5更新自动刷新)
微信小程序学习实录6(百度经纬度采集、手动调整精度、H5嵌入小程序、百度地图jsAPI、实时定位、H5更新自动刷新)
225 1
|
6月前
|
存储 Oracle 关系型数据库
百度搜索:蓝易云【oracle dblink mysql查询text无法显示问题】
通过使用 `DBMS_HS_PASSTHROUGH` 包执行 MySQL 查询并返回 CLOB 类型结果,可以解决 Oracle 数据库中无法直接显示 MySQL TEXT 类型数据的问题。
76 0
|
定位技术
百度地图定位
百度地图定位
|
搜索推荐 数据可视化 JavaScript
数据可视化大屏百度地图绘制行政区域标注实战案例解析(个性化地图、标注、视频、控件、定位、检索)
数据可视化大屏百度地图绘制行政区域标注实战案例解析(个性化地图、标注、视频、控件、定位、检索)
208 1
|
前端开发 定位技术 数据安全/隐私保护
百度地图高级开发:LBS服务实时定位覆盖范围内关键词标注的解决方案(2)
百度地图高级开发:LBS服务实时定位覆盖范围内关键词标注的解决方案(2)
89 0
|
移动开发 定位技术 API
百度地图开发:H5获取GPS-wg84经纬度与百度定位API的偏差测试
百度地图开发:H5获取GPS-wg84经纬度与百度定位API的偏差测试
207 0

热门文章

最新文章