当图像背景与颜色匹配时,Android工具栏菜单图标“消失”

时间:2015-08-09 17:01:07

标签: android material-design android-toolbar android-palette

看一下这张图片

enter image description here

左上角是Android汉堡包菜单,但它是白色的。另外,右边是搜索放大镜,也是白色。问题是后台是从服务器动态加载的,具体取决于呈现的内容。

是否可以对菜单图标进行着色或提升它们,以便在出现这种情况时出现?那个背景图像可能真的是任何颜色,它实际上取决于服务器的用途。也许可以在它们上使用Palette库吗?

编辑: 到目前为止我的解决方案基于@Steve响应:

private void loadBackdrop( String inetref ) {
    Log.i( TAG, "loadBackdrop : inetref=" + inetref );

    String bannerUrl = MainApplication.getInstance().getMasterBackendUrl() + "/Content/GetRecordingArtwork?Inetref=" + inetref + "&Type=banner&Height=256";
    Log.i(TAG, "loadBackdrop : bannerUrl=" + bannerUrl);
    final ImageView imageView = (ImageView) findViewById( R.id.backdrop );
    final PaletteTransformation paletteTransformation = PaletteTransformation.getInstance();
    Picasso.with( this )
            .load( bannerUrl )
            .fit().centerCrop()
            .transform( paletteTransformation )
            .into(imageView, new Callback.EmptyCallback() {

                @Override
                public void onSuccess() {

                    Bitmap bitmap = ((BitmapDrawable) imageView.getDrawable()).getBitmap(); // Ew!
                    Palette palette = PaletteTransformation.getPalette(bitmap);

                    try {

                        int inverseColor = getComplementaryColor(palette.getVibrantColor(R.color.white));
                        Log.i( TAG, "loadBackdrop : inverseColor=" + inverseColor + ", Color.WHITE=" + Color.WHITE + ", Color.BLACK=" + Color.BLACK + ", Color." + ( inverseColor > ( Color.BLACK / 2 ) ? "WHITE" : "BLACK" ) );

                        int color = ( inverseColor > ( Color.BLACK / 2 ) ? Color.WHITE : Color.BLACK );

                        collapsingToolbar.setCollapsedTitleTextColor( color );
                        collapsingToolbar.setExpandedTitleColor( color );

                        Drawable newSearchMenuItem = mSearchMenuItem.getIcon();
                        newSearchMenuItem.mutate().setColorFilter( color, PorterDuff.Mode.SRC_IN );
                        mSearchMenuItem.setIcon( newSearchMenuItem );

                        Drawable newUpMenuItem = getResources().getDrawable( R.drawable.ic_arrow_back_white_24dp );
                        newUpMenuItem.mutate().setColorFilter( color, PorterDuff.Mode.SRC_IN );
                        getSupportActionBar().setHomeAsUpIndicator( newUpMenuItem );

                    } catch( Exception e ) {
                        Log.e( TAG, "error decoding palette from imageView", e );
                    }
                }

                @Override
                public void onError() {

                }

            });

}

public static int getComplementaryColor( int colorToInvert ) {

    float[] hsv = new float[ 3 ];
    Color.RGBToHSV( Color.red( colorToInvert ), Color.green( colorToInvert ), Color.blue( colorToInvert ), hsv );

    hsv[ 0 ] = ( hsv[ 0 ] + 180 ) % 360;

    return Color.HSVToColor( hsv );
}

1 个答案:

答案 0 :(得分:1)

你应该看看docs。基本上你可以做的是为你想要着色的图标创建带有不同着色.png文件的自定义主题,然后根据你给出的背景颜色在代码中设置这些主题;或者你可以做一些类似于该网站上显示的内容。希望这有帮助!

编辑:你可以根据背景颜色做这样的事情:

MenuItem YOUR_MENU_ITEM = menu.findItem(R.id.YOUR_MENU_ITEM_ID);
Drawable NEW_ICON = (Drawable)YOUR_MENU_ITEM.getIcon();
NEW_ICON.mutate().setColorFilter(Color.argb(255, 200, 200, 200),PorterDuff.Mode.SRC_IN);
YOUR_MENU_ITEM.setIcon(NEW_ICON);

这会使图标灰色,但您只需更改滤镜的值即可。

  

你可以做些什么来解决动态加载背景的问题是使用case或嵌套if语句来检查服务器的背景,然后为更常见的颜色(红色,黄色,蓝色等)提供颜色过滤器选项。)通常黑/白将显示在大多数背景上,因此您可以将它们用作默认值。

编辑:进行颜色匹配:

  

所以你可以做一些像this这样的东西,它会将给定的颜色反转为它的赞美。另外请告诉我,如果那不是你想要的那样