Android仿支付宝9.5芝麻信用分仪表盘

支付宝刚刚升级到9.5.1,看了一眼里面的芝麻信用分,仪表盘挺好看的,之前也做了一个关于芝麻信用分的,不过那个是芝麻信用分解读,很多人以为是仪表盘,所以去下载,结果不言而喻,在此非常抱歉,现在想着来写一个这个版本的仪表盘,不说完全一模一样,只是为了猜测支付宝在做这个的时候是如何设计的,在此记录一下

先看看支付宝9.5.1的效果:



上图顶部有文本,中间是个仪表盘,仪表进度变化时用户的信用分会随着显示,同时背景颜色会随着变化,下面分别是芝麻分解读与信用提升,大体就是这样,底部猜测只是布局就能实现,所以不对它进行模仿


再看看做的效果:



模拟器上效果不是很好,在手机上是挺完美的,在此附上手机上的效果:



说说思路:

控件里各个区域的view位置准备采用View宽高的百分比来放置,这样顶部的位置就能确定了

中间仪表盘,里面的刻度值不规律,分别为350,550,600,650,700,750,950,之前一直没有想到什么办法,最后猜测支付宝是把这些值传递过来的,并且传递的值按照大概象限区分,即350-550算较差,550-600算中等,以此类推。所以仪表盘的内容基本上就可以写成实体对象,如:

package com.view.panel;

import java.io.Serializable;
import java.lang.String;import java.util.ArrayList;

/**
 * Created by wanghan on 16/1/22.
 */
public class SesameModel implements Serializable {
    private int userTotal;//用户信用分
    private String assess;//评价
    private int totalMin;//区间最小值
    private int totalMax;//区间最大值
    private String firstText;//第一个文本值:BETA
    private String fourText;//第四个文本:评估时间
    private String topText;//顶部文本
    private ArrayList<SesameItemModel> sesameItemModels;

    public String getTopText() {
        return topText;
    }

    public void setTopText(String topText) {
        this.topText = topText;
    }

    public String getFirstText() {
        return firstText;
    }

    public void setFirstText(String firstText) {
        this.firstText = firstText;
    }

    public String getFourText() {
        return fourText;
    }

    public void setFourText(String fourText) {
        this.fourText = fourText;
    }

    public int getUserTotal() {
        return userTotal;
    }

    public void setUserTotal(int userTotal) {
        this.userTotal = userTotal;
    }

    public String getAssess() {
        return assess;
    }

    public void setAssess(String assess) {
        this.assess = assess;
    }

    public int getTotalMin() {
        return totalMin;
    }

    public void setTotalMin(int totalMin) {
        this.totalMin = totalMin;
    }

    public int getTotalMax() {
        return totalMax;
    }

    public void setTotalMax(int totalMax) {
        this.totalMax = totalMax;
    }

    public ArrayList<SesameItemModel> getSesameItemModels() {
        return sesameItemModels;
    }

    public void setSesameItemModels(ArrayList<SesameItemModel> sesameItemModels) {
        this.sesameItemModels = sesameItemModels;
    }
}

package com.view.panel;

import java.io.Serializable;

/**
 * Created by wanghan on 16/1/22.
 */
public class SesameItemModel implements Serializable {
    private String area;//区域:良好,中等,较差...
    private int min;//该区域最小值
    private int max;//该区域最大值

    public String getArea() {
        return area;
    }

    public void setArea(String area) {
        this.area = area;
    }

    public int getMax() {
        return max;
    }

    public void setMax(int max) {
        this.max = max;
    }

    public int getMin() {
        return min;
    }

    public void setMin(int min) {
        this.min
  • 4
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 12
    评论
评论 12
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值