新浪微博第三方登录界面上下拉伸图片之第三方开源PullToZoomListViewEx(二)

上篇文章给大家介绍了新浪微博第三方登录界面上下拉伸图片之第三方开源PullToZoomListViewEx(一),需要了解的朋友可以点击了解详情。

这是PullZoomView在ScrollView实现,Android PullZoomView在ScrollView的实现是:PullToZoomScrollViewEx

下载地址:https://github.com/Frank-Zhu/PullZoomView

本文要说的PullToZoomScrollViewEx则以另外一种方式在Java代码中动态的为PullZoomView装载View:

private void loadViewForPullToZoomScrollView(PullToZoomScrollViewEx scrollView) {
  View headView = LayoutInflater.from(this).inflate(R.layout.head_view, null);
  View zoomView = LayoutInflater.from(this).inflate(R.layout.head_zoom_view, null);
  View contentView = LayoutInflater.from(this).inflate(R.layout.content_view, null);
  scrollView.setHeaderView(headView);
  scrollView.setZoomView(zoomView);
  scrollView.setScrollContentView(contentView);
 } 

两点内容需要注意:

(1)所有Android PullZoomView的头部及缩放效果都可以关闭或者开启,具体方式就是通过改变设置各种方法的true或false值。以下是比较重要的几个方法:

setParallax(boolean b);

true则有视差效果,false则无。

setHideHeader(boolean b);

true则隐藏自己定义的head view,false则显示。

setZoomEnabled(boolean b);
true支持缩放,false不支持缩放。

默认的,

setParallax(true);
setHideHeader(false);
setZoomEnabled(true);

(2)PullZoomView中嵌套的子View,需要通过getPullRootView().findViewById(R.id.xxxx)这样的方式找出来,而不是直接的findViewById()。

下面给出一个完整例子加以说明。

先写一个布局:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  xmlns:custom="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="match_parent" >
  <com.ecloud.pulltozoomview.PullToZoomScrollViewEx
   android:id="@+id/scroll_view"
   android:layout_width="match_parent"
   android:layout_height="match_parent" />
 </RelativeLayout> 

Java代码:

 package com.zzw.testpullzoomview_scrollview;
 import com.ecloud.pulltozoomview.PullToZoomScrollViewEx;
 import android.app.Activity;
 import android.os.Bundle;
 import android.util.DisplayMetrics;
 import android.util.Log;
 import android.view.LayoutInflater;
 import android.view.Menu;
 import android.view.MenuItem;
 import android.view.View;
 import android.widget.LinearLayout;
 public class MainActivity extends Activity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   setContentView(R.layout.activity_main);
   // 注意初始化顺序,不要弄乱,否则抛出运行时空指针
   PullToZoomScrollViewEx scrollView = (PullToZoomScrollViewEx) findViewById(R.id.scroll_view);
   loadViewForPullToZoomScrollView(scrollView);
   scrollView.getPullRootView().findViewById(R.id.tv_test).setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
     Log.d("PullToZoomScrollViewEx", "onClick");
    }
   });
   scrollView.getPullRootView().findViewById(R.id.tv_test).setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
     Log.e("PullToZoomScrollViewEx", "onClick");
    }
   });
   scrollView.getPullRootView().findViewById(R.id.tv_test).setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
     Log.d("PullToZoomScrollViewEx", "onClick");
    }
   });
   setPullToZoomViewLayoutParams(scrollView);
  }
  private void loadViewForPullToZoomScrollView(PullToZoomScrollViewEx scrollView) {
   View headView = LayoutInflater.from(this).inflate(R.layout.head_view, null);
   View zoomView = LayoutInflater.from(this).inflate(R.layout.head_zoom_view, null);
   View contentView = LayoutInflater.from(this).inflate(R.layout.content_view, null);
   scrollView.setHeaderView(headView);
   scrollView.setZoomView(zoomView);
   scrollView.setScrollContentView(contentView);
  }
  // 设置头部的View的宽高。
  private void setPullToZoomViewLayoutParams(PullToZoomScrollViewEx scrollView) {
   DisplayMetrics localDisplayMetrics = new DisplayMetrics();
   getWindowManager().getDefaultDisplay().getMetrics(localDisplayMetrics);
   int mScreenHeight = localDisplayMetrics.heightPixels;
   int mScreenWidth = localDisplayMetrics.widthPixels;
   LinearLayout.LayoutParams localObject = new LinearLayout.LayoutParams(mScreenWidth,
     (int) (.F * (mScreenWidth / .F)));
   scrollView.setHeaderLayoutParams(localObject);
  }
 } 

java代码需要的子布局:

head_view.xml:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/layout_view"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:layout_gravity="bottom"
  android:gravity="bottom">
  <ImageView
   android:id="@+id/iv_user_head"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_centerInParent="true"
   android:src="@drawable/ic_launcher" />
  <TextView
   android:id="@+id/tv_user_name"
   android:textSize="sp"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_below="@id/iv_user_head"
   android:layout_centerHorizontal="true"
   android:text="新浪微博"
   android:textColor="#ffffff" />
  <LinearLayout
   android:id="@+id/ll_action_button"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:background="#"
   android:layout_alignParentBottom="true"
   android:padding="dip">
   <TextView
    android:id="@+id/tv_register"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="注册"
    android:layout_weight=""
    android:textSize="sp"
    android:gravity="center"
    android:layout_gravity="center"
    android:textColor="#ffffff" />
   <TextView
    android:id="@+id/tv_login"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="登录"
    android:layout_weight=""
    android:textSize="sp"
    android:gravity="center"
    android:layout_gravity="center"
    android:textColor="#ffffff" />
  </LinearLayout>
 </RelativeLayout> 

head_zoom_view.xml:

 <?xml version="." encoding="utf-"?>
 <ImageView xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/imageView"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:layout_gravity="center_horizontal"
  android:scaleType="centerCrop"
  android:src="@drawable/a" /> 

head_zoom_view其实就放了一张可供缩放拉伸的图片。

content_view.xml:

 <?xml version="." encoding="utf-"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="#ffffff"
  android:orientation="vertical" >
  <TextView
   android:id="@+id/tv_test"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:id="@+id/tv_test"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:id="@+id/tv_test"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:background="#eeeeee" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
  <TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:gravity="center_vertical"
   android:padding="dp"
   android:text="test"
   android:textSize="sp" />
 </LinearLayout> 

实际开发中,如果确定要用ScrollView包括自己项目中的子View,那么content_view.xml就是其他View的装载“父”布局。重点需要在content_view.xml中展开。

(0)

相关推荐

  • iOS应用开发中图片的拉伸问题解决方案

    纵观移动市场,一款移动app,要想长期在移动市场立足,最起码要包含以下几个要素:实用的功能.极强的用户体验.华丽简洁的外观.华丽外观的背后,少不了美工的辛苦设计,但如果开发人员不懂得怎么合理展示这些设计好的图片,将会糟蹋了这些设计,功亏一篑. 比如下面张图片,本来是设计来做按钮背景的: button.png,尺寸为:24x60 现在我们把它用作为按钮背景,按钮尺寸是150x50: 复制代码 代码如下: // 得到view的尺寸  CGSize viewSize = self.view.bound

  • iOS图片拉伸的方法

    假如下面的一张图片,是用来做按钮的背景图片的,原始尺寸是76 × 40 我们通过代码将这张图片设置为按钮的背景图片,假如我们将创建好的按钮的宽高设置为:(W=200, H=50)代码如下: // 初始化按钮 UIButton *button = [[UIButton alloc] init]; // 设置尺寸 button.frame = CGRectMake(100, 200, 200, 50); // 加载图片 UIImage *image = [UIImage imageNamed:@"p

  • 使用JavaScript解决网页图片拉伸问题(推荐)

    问题描述 这段时间在做PM的需求的时候突然发现一个问题,产品上的图片来自多个第三方,具体的尺寸无法确定,如果直接在样式中写死图片的尺寸大小就会出现图片拉伸的现象,十分影响产品的美观,因此希望可以找到一个比较好的解决方案.自己先做了一个简单的demo来展示问题. <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <

  • iOS图片拉伸小技巧

    纵观移动市场,一款移动app,要想长期在移动市场立足,最起码要包含以下几个要素:实用的功能.极强的用户体验.华丽简洁的外观.华丽外观的背后,少不了美工的辛苦设计,但如果开发人员不懂得怎么合理展示这些设计好的图片,将会糟蹋了这些设计,功亏一篑. 比如下面张图片,本来是设计来做按钮背景的: button.png,尺寸为:24x60 现在我们把它用作为按钮背景,按钮尺寸是150x50: // 得到view的尺寸 CGSize viewSize = self.view.bounds.size; // 初

  • iOS图片拉伸技巧(iOS5.0、iOS6.0)

    纵观移动市场,一款移动app,要想长期在移动市场立足,最起码要包含以下几个要素:实用的功能.极强的用户体验.华丽简洁的外观.华丽外观的背后,少不了美工的辛苦设计,但如果开发人员不懂得怎么合理展示这些设计好的图片,将会糟蹋了这些设计,功亏一篑. 比如下面张图片,本来是设计来做按钮背景的: button.png,尺寸为:24x60 现在我们把它用作为按钮背景,按钮尺寸是150x50: - (void)viewDidLoad { [super viewDidLoad]; // 得到view的尺寸 CG

  • iOS图片拉伸的4种方法

    假如下面的一张图片,是用来做按钮的背景图片的,原始尺寸是(128 * 112) 按钮背景图片.png 我们通过代码将这张图片设置为按钮的背景图片,假如我们将创建好的按钮的宽高设置为:(W=200, H=50)代码如下: // // ViewController.m // iOS图片拉伸总结 // // Created by Sunshine on 15/6/29. // Copyright (c) 2015年 YotrolZ. All rights reserved. // #import "V

  • iOS图片拉伸的多种方式

    本文实例为大家分享了iOS图片拉伸的具体代码,供大家参考,具体内容如下 1. UIImageView整体拉伸 UIImageView-contentMode typedef NS_ENUM(NSInteger, UIViewContentMode) { UIViewContentModeScaleToFill, // 默认 拉伸(会变形) UIViewContentModeScaleAspectFit, // 等比例拉伸 UIViewContentModeScaleAspectFill, //

  • iOS图片实现可拉伸不变形的处理操作

    在iOS的实际开发中,如果我们把一张有图片(有特别形状的,特别是类似有圆角的图片)放在UIButton中,当UIButton改变大小是,图片可能会被拉伸并且产生变形,我们可以通过-(UIImage *)resizableImageWithCapInsets:resizingMode:方法(通过UIImage对象调用该方法,并且传入要拉伸的图片的名字作为参数)实现返回一个可拉伸不变形的图片,这里我们把这个方法写到UIImage类的分类中把它封装起来,日后的iOS开发中我们可以直接拿来使用: UII

  • iOS图片拉伸技巧小结

    对于有些图标等按钮 在美工设计的按钮下可以通过拉伸效果处理所需效果,最熟悉的莫过于微信聊天的 椭圆背景,也是通过这个这个原理进行背景图片. 如对该图片拉伸,如何操作? 首先找到要拉伸的部分,很明显 两侧椭圆是不变 要拉伸的是中间部分,如何指定中间部位,先看下图 指定这4个宽度后 会形成黑色模块 直白点就是 这块内容就是拉伸后中间那块不断填充的部分 具体代码: UIImage* img=[UIImage imageNamed:@"2.png"];//原图 UIEdgeInsets edg

  • 新浪微博第三方登录界面上下拉伸图片之第三方开源PullToZoomListViewEx(二)

    上篇文章给大家介绍了新浪微博第三方登录界面上下拉伸图片之第三方开源PullToZoomListViewEx(一),需要了解的朋友可以点击了解详情. 这是PullZoomView在ScrollView实现,Android PullZoomView在ScrollView的实现是:PullToZoomScrollViewEx 下载地址:https://github.com/Frank-Zhu/PullZoomView 本文要说的PullToZoomScrollViewEx则以另外一种方式在Java代码

  • Android集成新浪微博第三方登录的方法

    本文实例讲述了Android集成新浪微博第三方登录的方法.分享给大家供大家参考.具体实现方法如下: 1.下载微博的sdk ,导入微博的jar包两个 android-support-v4.jar和weibosdkcore.jar两个包 2.把新浪微博中的demo_src中SDK中的com,导入到项目中 3.用demo中的constants,主要是参数设置,将里面的参数改成自己的参数. 4.编写代码,主要步骤如下: 复制代码 代码如下: // 初始化微博对象 mWeiboAuth = new Wei

  • Selenium+Python 自动化操控登录界面实例(有简单验证码图片校验)

    从最简单的Web浏览器的登录界面开始,登录界面如下: 进行Web页面自动化测试,对页面上的元素进行定位和操作是核心.而操作又是以定位为前提的,因此,对页面元素的定位是进行自动化测试的基础. 页面上的元素就像人一样,有各种属性,比如元素名字,元素id,元素属性(class属性,name属性)等等.webdriver就是利用元素的这些属性来进行定位的. 可以用于定位的常用的元素属性: id name class name tag name link text partial link text xp

  • Android实现第三方登录的上拉展开,下拉隐藏,下拉隐藏示例

    Android的UI和交互是很重要的一部分,直接影响到用户对软件的体验.随着项目经验的积累,发现Android中动画的运用越来越重要.本篇文章抽出了项目登录界面中实现的第三方登录,用户可以上拉展开,下拉隐藏第三方登录这么一个效果,提高用户和软件的交互性. 实现效果: (1)activity_main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android=&q

  • Android 第三方登录、分享(ShareSDK、友盟)

    为下边的项目做准备,写一个第三方登录.分享的demo.分别使用sharesdk和友盟来实现. 先说一下我对两者的使用上的感觉,个人感觉sharesdk比友盟更好一点,好在哪里呢?好在人工服务上.在集成的过程中遇到了各种问题,但是sharesdk的人工服务做的很好,能给答疑解惑,提供解决问题的方法! 接下来上代码(本文使用android studio开发,sharesdk版本v2.7.7,友盟版本v6.0.0): 一.使用sharesdk(sharesdk版本v2.7.7)来集成: 1.要去官网:

  • Android 友盟第三方登录与分享的实现代码

    前言 最近项目中又一次需要集成友盟的三方登录与分享,之前没有记录过,所以这次来写一下... 准备工作 1.注册友盟账号创建应用,获取key:申请地址 http://www.umeng.com 2.对对应的平台(腾讯.微信.新浪等等)申请第三方账号,获取key和密码 集成步骤 因为shareSDK分享与第三方登录集成方式类似(共用jar包),所以我就一起说了. 1.下载shareSDK分享的SDK 下载地址: https://developer.umeng.com/sdk 2.导入jar与res

  • SwiftUI 登录界面布局实现示例详解

    目录 引言 页面分析-元素构成 实战编程-背景图片 实战编程-说明文字 实战编程-登录方式 实战编程-辅助文字 本章小结 引言 为了更好地了解和学习SwiftUI,我们快速学习SwiftUI的三种基本布局:HStack水平布局容器.VStack垂直布局容器.ZStack层叠布局容器. 在实际开发过程中,登录页面是移动端产品必不可少的页面,也是很好的练手项目. 接下来,我们将用10分钟来构建一个登录页面布局,以下面UI设计稿为例: 页面分析-元素构成 采用自顶向下的设计思想拆解UI设计稿的元素,可

  • 浅谈PHP接入(第三方登录)QQ登录 OAuth2.0 过程中遇到的坑

    前言 绝大多数网站都集成了第三方登录,降低了注册门槛,增强了用户体验.最近看了看 QQ 互联上 QQ 登录的接口文档.接入 QQ 登录的一般流程呢,是这样的:先申请开发者 -> 然后创建应用(拿到一组 AppId 和 AppKey)-> 获取 access_token -> 获取 openid -> 调用 openApi 访问或修改用户信息. 然而,从申请个人开发者开始,坑就来了. 1. 申请(个人)开发者 QQ 互联中申请开发者信息的页面,一些重点太过简陋,缺失细节,比如身份证正

  • 使用jQuery,Angular实现登录界面验证码详解

    写在前面: 前段事件,做了一个用ajax后台异步交互的登录功能,自己在上面加了一个验证码的功能,这个功能背后的原理挺好理解的,实现起来也十分简单,特此写波分享,,自己写的过程中踩了不少坑,这里还是照例写的详细点,大家可以做个参考,喜欢的朋友可以点个赞,或者关注一波. 最终实现的效果: 当点击登录之前,会先判断验证码是否正确(验证码可以不区分大小写,也可以区分大小写),验证码错误会刷新验证码,验证码验证之前,不会进行跨域登录操作. 整体思路. 1.取四位随机数 2.赋值到验证码的input框里.

  • 使用java swing实现qq登录界面示例分享

    用Java Swing做的一个QQ登录界面 复制代码 代码如下: import java.awt.Container;import java.awt.Image;import java.awt.event.ActionEvent;import java.awt.event.ActionListener; import javax.swing.ImageIcon;import javax.swing.JButton;import javax.swing.JCheckBox;import javax

随机推荐