手写喜马拉雅APP特效

最新推荐文章于 2024-04-01 09:56:03 发布

置顶

路很长oO

最新推荐文章于 2024-04-01 09:56:03 发布

阅读量5.5k

点赞数 16

分类专栏： Android UI 文章标签：喜马拉雅UI 喜马拉雅 Android 喜马拉雅模仿喜马拉雅喜马拉雅滑动效果

本文链接：https://blog.csdn.net/m0_37667770/article/details/109176786

版权

本文介绍了如何模仿喜马拉雅APP实现首页特效，包括banner图切换时主题和View颜色的丝滑变化，列表滑动时的主题切换，Fragment切换时的页面主题色设定，以及搜索框和背景图案的细节处理。通过使用Palette工具分析图片颜色，结合ImageLoaderInterface监听，实现颜色的动态调整。

摘要由CSDN通过智能技术生成

喜马拉雅App

前言

喜马拉雅UI是目前我所看到的最优美简洁体验效果极佳的应用了，工作之余写写特效欢迎一起进步学习

一、喜马拉雅首页特效

1.banner图切换丝滑改变主题和View的颜色。

2.列表的滑动更改主题和View的颜色。

在这里插入图片描述

3.Fragment切换在不同的页面主题色都会根据当前所在碎片的banner图进行设置主题色。

在这里插入图片描述

4.细节部分:搜索框内的字体以及搜索红色圆弧的颜色都跟随改变和切换。以及背景部分有圆角图案很美。

在这里插入图片描述

二、我实现的效果如下：

1.banner图切换之间改变主题和View的颜色部分。

在这里插入图片描述

2.随着列表滑动切换主题和View的颜色部分。

在这里插入图片描述

3.随着碎片切换主题色丝滑改变且当前在顶层的碎片决定主题色。以及背景图案等的细节处理。

在这里插入图片描述

三、每个功能的实现思路和代码。

1.主题颜色根据banner图的颜色来显示的。我们会想到Palette(调色板)颜色分析帮助类。不明白的可以看我的博客Palette打造你炫酷统一色彩的界面,2年前写的比较简陋看看就行。

2.首先我们看看Palette如何获取banner颜色。

 //1.初始化开始
 Palette.from(bitmap).generate()
 //2.generate里面我们可以看到
 scaleBitmapDown方法里面进行了位图缩放。默认112*112的。
//3.在ColorCutQuantizer里面进行位图像素的获取。
int[] getPixelsFromBitmap(Bitmap bitmap)
//4.根据图像位图像素来进行获取量化颜色
  for (int i = 0; i < pixels.length; i++) {
   
            final int quantizedColor = quantizeFromRgb888(pixels[i]);
            // Now update the pixel value to the quantized value
            pixels[i] = quantizedColor;
            // And update the histogram
            hist[quantizedColor]++;
        }
//5.获取对应的颜色
    if (distinctColorCount <= maxColors) {
   
            // The image has fewer colors than the maximum requested, so just return the colors
            mQuantizedColors = new ArrayList<>();
            for (int color