• Stars
    star
    640
  • Rank 70,324 (Top 2 %)
  • Language
    Java
  • License
    Apache License 2.0
  • Created almost 9 years ago
  • Updated over 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

SpiderWebScoreView 是 Android 上的一个蛛网评分控件 SpiderWebScoreView Android is used on a cobweb score view

logo_image SpiderWebScoreView

Platform API Android Arsenal Release Version

SpiderWebScoreView 是一个蛛网评分控件,可以方便的显示任意层级任意维度的数据

sample_image

特点

  • 支持任意个角以及任意层级
  • 蛛网图形外边的分数文案支持任意样式
  • 不管是多少维度都可左右对称

开始使用

1. 从 mavenCentral 导入 SpiderWebScoreView

在 app 的 build.gradle 文件的 dependencies 节点中加入依赖

dependencies{
	implementation("io.github.panpf.spiderwebscoreview:spiderwebscoreview:${LAST_VERSION}")
}

${LAST_VERSION}: Download (No include 'v')

最低支持 Android2.3

2. 在布局中使用

在布局中使用声明 SpiderWebScoreView 和 CircularLayout,如下:

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:clipChildren="false">

    <me.panpf.swsv.SpiderWebScoreView
        android:id="@+id/spiderWeb_mainActivity_1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center" />

    <me.panpf.swsv.CircularLayout
        android:id="@+id/layout_mainActivity_circular1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:clipChildren="false"/>
</FrameLayout>

详解:

  • SpiderWebScoreView 用来显示蛛网图形
  • CircularLayout 用来显示四周的文案
  • CircularLayout 的 尺寸 必须和 SpiderWebScoreView 一致 并且是层叠关系
  • CircularLayout 的子 View 将会显示在圆圈的外面,因此 CircularLayout 和其 父 FrameLayout 都必须设置 clipChildren 为 false
  • 父 FrameLayout 还要比 CircularLayout 大一圈,大的这一圈就是用来显示 CircularLayout 的子 View,具体大多少视你的需求而定

3. 在代码中设置分值

在代码中通过 SpiderWebScoreView.setScores(float maxScore, float[] scores) 方法设置最大分数以及所有分值即可

  • 有多少个分值(scores.length)蛛网图形就有多少个角
  • 默认分 5 层

然后根据你的需求往 CircularLayout 里面添加显示分数的 View 即可,数量和顺序必须同 scores 相同,如下:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    SpiderWebScoreView spiderWebScoreView1 = (SpiderWebScoreView) findViewById(R.id.spiderWeb_mainActivity_1);
    CircularLayout circularLayout1 = (CircularLayout) findViewById(R.id.layout_mainActivity_circular1);

	Score[] scores = new Score[]{
		new Score(7.0f, R.drawable.vip_icon7),
		new Score(8.0f, R.drawable.vip_icon8),
		new Score(5.0f, R.drawable.vip_icon5),
		new Score(5.0f, R.drawable.vip_icon5),
		new Score(8.0f, R.drawable.vip_icon8),
		new Score(7.0f, R.drawable.vip_icon7),
	};
    setup(spiderWebScoreView1, circularLayout1, scores);
}

private void setup(SpiderWebScoreView spiderWebScoreView, CircularLayout circularLayout, Score... scores){
	float[] scoreArray = new float[scores.length];
    for(int w = 0; w < scores.length; w++){
        scoreArray[w] = scores[w].score;
    }
    spiderWebScoreView.setScores(10f, scoreArray);

    circularLayout.removeAllViews();
    for(Score score : scores){
        TextView scoreTextView = (TextView) LayoutInflater.from(getBaseContext()).inflate(R.layout.score, circularLayout, false);
        scoreTextView.setText(score.score+"");
        if(score.iconId != 0){
            scoreTextView.setCompoundDrawablesWithIntrinsicBounds(0, 0, score.iconId, 0);
        }
        circularLayout.addView(scoreTextView);
    }
}

private static class Score{
    private float score;
    private int iconId;

    private Score(float score, int iconId) {
        this.score = score;
        this.iconId = iconId;
    }

    private Score(float score) {
        this.score = score;
    }
}

4. 布局属性

SpiderWebScoreView

属性名 介绍 对应方法 缺省值
angleCount 设置蛛网图形有多少个角 会在setScores(float, float[])方法中根据scores的长度来覆盖此参数 5
hierarchyCount 设置蛛网图形有多少层 setHierarchyCount(int) 5
maxScore 最大分值 setScores(float, float[])方法的第一个参数就是maxScore 10f
lineColor 蛛网线条的颜色 setLineColor(int) 0xFF000000
lineWidth 蛛网线条的宽度 setLineWidth(float) -1(不设置,Paint默认宽度)
scoreColor 分数图形的颜色 setScoreColor(int) 0x80F65801
scoreStrokeColor 分数图形描边的颜色 setScoreStrokeColor(int) 0xFFF65801
scoreStrokeWidth 分数图形描边的宽度 setScoreStrokeWidth(float) -1(不设置,Paint默认宽度)
disableScoreStroke 禁用分数图形描边 setDisableScoreStroke(boolean) false

CircularLayout

属性名 介绍 对应方法 缺省值
spacing 设置子View与圆圈之间的距离 setSpacing(int) 8dp

更多示例请参考 sample 源码

License

Copyright (C) 2017 Peng fei Pan <[email protected]>

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

  http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

More Repositories

1

sketch

Sketch is a powerful and comprehensive image load library on Android, in addition to the basic functions, it also supports Jetpack Compose, GIF, SVG, video thumbnails, gesture zoom, huge images sampling, ExifInterface and other functions. Sketch 是 Android 上的一个强大且全面的图片加载库,除了基础功能外,还支持 Jetpack Compose、GIF、SVG、视频缩略图、手势缩放、超大图采样、ExifInterface 等功能。
Kotlin
1,934
star
2

switch-button

SwitchButton 是 Android 上的一个开关按钮控件 【Deprecated】【Stop maintenance】
Java
332
star
3

assembly-adapter

AssemblyAdapter 是 Android 上的一个为各种 Adapter 提供开箱即用实现的库。AssemblyAdapter is a library on Android that provides out-of-the-box implementations for various Adapters.
Kotlin
173
star
4

pager-indicator

这是 Android 上的一个 ViewPager 页面指示器组件,用于标识当前显示的页面
Java
139
star
5

bintray-publish

Super easy way to publish your Android and Java artifacts to bintray.
Groovy
97
star
6

scratch-award-view

这是一个刮刮卡组件,用于实现刮奖效果
Java
52
star
7

stickyitemdecoration

RecyclerView 黏性 item 实现。RecyclerView sticky item implementation.
Kotlin
18
star
8

android-sheller

Sheller 是 Android 上的一个 shell 库,可帮助开发者方便的执行 shell 命令
Java
11
star
9

view-expander

ViewExpander 用来快速实现 View 展开关闭效果,使用非常简单,适用于所有的 View
Java
10
star
10

barcode-utils

BarcodeUtils 是一个条码解析、生成、扫描库,基于 zxing 封装,适合快速在项目中集成条码相关功能
Java
7
star
11

android-activitymonitor

Android, Activity, Monitor
Java
4
star
12

zoomimage

Android library for scaling images, supporting double-tap zoom, gesture zoom, single-finger drag, inertial swipe, location, rotate, huge image sub-sampling loading, and more. Both View and Compose are supported. 用于缩放图像的 Android 库,支持双击缩放、手势缩放、单指拖动、惯性滑动、定位、旋转、超大图采样加载等功能。支持 View 和 Compose。
Kotlin
3
star
13

tools4a

Extensions to the Android standard library and support libraries and some basic tools
Java
2
star
14

tools4k

Extensions to the Kotlin standard library
Kotlin
2
star
15

tools4j

Extensions to the Java standard library, some tool methods related to File, IO, primitive types, String, Array, and Collection
Java
2
star
16

maven-publish-gradle-plugin

Gradle plugin that configures an uploadArchives task to automatically upload all of your Java, Kotlin or Android libraries to any Maven instance.
Kotlin
2
star
17

android-liveevent

Java
1
star
18

jsonx

Extensions to the org.json standard library
Java
1
star