精华内容
下载资源
问答
  • 如果,网站是挂在外网上,或者网速过低,又大量使用图标的情况下,由于浏览器和服务器的并发连接数是受限的,通常是4~8个,那么图标显示过慢或者超时的情况就会发生。 当然了,像采用CDN,或者按照浏览器的并发数...

    现在的网页中显示很多图标算是常态,发现项目中页面上用到的图标都是单个图标单个文件,用的时候直接往页面上挂,这确实很常态。

    如果,网站是挂在外网上,或者网速过低,又大量使用图标的情况下,由于浏览器和服务器的并发连接数是受限的,通常是4~8个,那么图标显示过慢或者超时的情况就会发生。

    当然了,像采用CDN,或者按照浏览器的并发数对图片文件进行域名分散存储处理也是再好不过的,但不是都有这样的条件。

    一般都会把图标文件做的尽可能小,尽管如此,1张50k的文件比起50张1k文件下载起来还是很有优势的。

    那么,要如何将一个图片中的单个图标显示在页面中,因为没有切分图片的功能。

     

    首先,假设我们的图标图片是tree view中常用的:



    做一个简单的页面,放两个div,需要在这两个div上分别显示文件夹和文件图标。

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <style>        </style>
        </head>
        <body>
            <div></div>
            <div></div>
        </body>
    </html>

     

    显示方法很简单,就是将元素的大小设成图标的大小,图片作为元素的背景,设置图片的left和top让对应的图标被显露出来。

    定义一个默认的样式,规定元素的大小,这里的图标是32*32,照样设置元素的大小。

                .tree-default{
                    width:32px;
                    height:32px;
                }
    定义文件夹图标的显示样式,就是讲图标图片作为背景,按照图标的位置调整left和top坐标值。

                .tree-folder{
                    background: url("images/tree_icons_32px.png") -260px -4px no-repeat;
                }
    定义文件图标的显示样式,调整文件图标所在的位置。

                .tree-file{
                    background: url("images/tree_icons_32px.png") -100px -68px no-repeat;
                }
    再给元素设上样式。

            <div class="tree-default tree-file"></div>
            <div class="tree-default tree-folder"></div>

    完成后的效果:

     

    这样的处理也不是没有条件,单张图片也要尽可能的压缩,不是所有的图标都在一张图片上,可将常用的放在一张图片上,如果过多可分成多张图片放置。

     

    所有代码:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <style>
                .tree-default{
                    width:32px;
                    height:32px;
                }
    
                .tree-file{
                    background: url("images/tree_icons_32px.png") -100px -68px no-repeat;
                }
    
                .tree-folder{
                    background: url("images/tree_icons_32px.png") -260px -4px no-repeat;
                }
    
            </style>
        </head>
        <body>
            <div class="tree-default tree-file"></div>
            <div class="tree-default tree-folder"></div>
        </body>
    </html>








    展开全文
  • win7上图片显示图标,不显示缩略图;不管是调节小图、中图还是大图或者其他均不显示;而且这种情况下使用截图工具截下来的图片都不自动带上扩展名;情况如下图:     解决方案: 打开计算机—》组织—》...

    问题描述:

    win7上图片只显示图标,不显示缩略图;不管是调节小图、中图还是大图或者其他均不显示;而且这种情况下使用截图工具截下来的图片都不自动带上扩展名;情况如下图:

     

     

    解决方案:

    打开计算机—》组织—》文件夹和搜索选项—》查看(tab标签)—》去掉”始终显示图标,不显示缩略图”的对勾;图解如下:

    展开全文
  • Android通知栏图标显示网络图片

    千次阅读 2018-01-17 16:41:53
    刚开始想先显示通知栏,之后异步下载并图片并更新图标,但却一直不能显示网络图片,如下: ImageRequest request = new ImageRequest(getNotificationStatusIcon(), new Response.Listener(){ @Override ...

    Android平台提供了默认的通知栏实现,如下的代码就能实现:

    NotificationManager manager = (NotificationManager) context.getSystemService(Context.NOTIFICATION_SERVICE);
    NotificationCompat.Builder builder = new NotificationCompat.Builder(context);
    
    builder.setContentTitle(getNotificationTitle())
           .setContentText(getNotificationContent())
           .setSmallIcon(iconDrawableId)
           .setTicker(getNotificationContent())
           .setAutoCancel(true)
           .setContentIntent(pendingIntent);
    
    manager.notify(notifyTitleId, builder.build());
    这种方式虽然简单,但图标不能为网络图片,因此我们需要使用自定义的方式。

    刚开始想先显示通知栏,之后异步下载并图片并更新图标,但却一直不能显示网络图片,如下:

    ImageRequest request = new ImageRequest(getNotificationStatusIcon(),
            new Response.Listener<Bitmap>(){
    
                @Override
                public void onResponse(Bitmap response) {
                    remoteView.setImageViewBitmap(iconId, response);
    
                }
            }, 0, 0, Bitmap.Config.RGB_565,
            new Response.ErrorListener() {
    
                @Override
                public void onErrorResponse(VolleyError error) {
    
                 }
    
            });
    但图片获取成功了,显示无法成功。后来改变了顺序,先将图片下载了,之后再显示通知栏,居然显示正常了。

    ImageRequest request = new ImageRequest(getNotificationStatusIcon(),
                               new Response.Listener<Bitmap>(){
    
                                    @Override
                                    public void onResponse(Bitmap response) {
                                        pushCustomNotification(context, response);
    
                                    }
                                }, 0, 0, Bitmap.Config.RGB_565,
                                new Response.ErrorListener() {
    
                                    @Override
                                    public void onErrorResponse(VolleyError error) {
                                        pushDefaultNotification(context);
    
                                    }
    
                                });
    ......
    
    private void pushCustomNotification(Context context, Bitmap icon){
            Intent intent;
            try {
                intent = Intent.parseUri(getIntent(), 0);
                PendingIntent pendingIntent = PendingIntent.getActivity(context, 0, intent, PendingIntent.FLAG_UPDATE_CURRENT);
    
                final int notifyTitleId = ResourceUtil.getStringId(context,"push_mail_notification_title");
                NotificationManager manager = (NotificationManager) context.getSystemService(Context.NOTIFICATION_SERVICE);
                NotificationCompat.Builder builder = new NotificationCompat.Builder(context);
                final int iconDrawableId = ResourceUtil.getDrawableId(context, "mail_push_icon");
                final int iconId = ResourceUtil.getId(context, "push_notification_icon");
    
                final RemoteViews view = new RemoteViews(context.getPackageName(), ResourceUtil.getLayoutId(context, "layout_custom_notification"));
                view.setTextViewText(ResourceUtil.getId(context, "push_notification_title"), getNotificationTitle());
                view.setTextViewText(ResourceUtil.getId(context, "push_notification_content"), getNotificationContent());
                view.setImageViewBitmap(iconId, icon);
    
    
                builder.setCustomContentView(view)
                        .setSmallIcon(iconDrawableId)
                        .setTicker(getNotificationContent())
                        .setAutoCancel(true)
                        .setContentIntent(pendingIntent);
    
                manager.notify(notifyTitleId+1, builder.build());
    
    
            } catch (URISyntaxException e) {
                e.printStackTrace();
            }
    
        }
    






    展开全文
  • 解决电脑桌面图标显示为空白图片

    万次阅读 2016-10-01 00:20:46
    你是否遇到过电脑中个别程序的图标无缘无故变成空白,但是却能正常打开的情况呢?虽然不影响使用,但是看着也太不爽了吧!我是忍不了啊。  好了,介绍下解决的方法(以本人电脑为例,window7系统): 1.打开“计算机...

           你是否遇到过电脑中个别程序的图标无缘无故变成空白,但是却能正常打开的情况呢?虽然不影响使用,但是看着也太不爽了吧!我是忍不了啊。

           好了,介绍下解决的方法(以本人电脑为例,window7系统):

    1.打开“计算机”,点击左上角“组织”,选择“文件夹和搜索选项”,在弹出的对话框中选择“查看”,在高级设置中选择“显示隐藏的文件、文件夹和驱动器”。

                                                 Alt


    2.打开C盘,进入到“ C:\用户\你的用户名\AppData\Local”,在此文件夹下寻找一个叫做"IconCache.db"的文件,此文件即是系统的图标缓存库文件,删除这个IconCache.db文件。


    3.打开任务管理器(右键任务栏打开 或者 Ctrl+Shift+Esc),在“进程”栏中找到并结束explorer.exe进程。

                                                 Alt


    4.是不是发现桌面上什么东西都没啦,连任务栏都没有了?别着急,它会回来的。  在任务管理器中的“文件”里选择“新建任务(运行)”,在弹出输入框中输入explorer,点击“确定”。

                                                 Alt

    是不是回来了呢?  运行此步骤的目的是为了重启桌面程序以达到让桌面环境自动刷新重建图标缓存的目的。

    好了,操作完毕,异常图标是不是恢复了呢?如果没有恢复,有可能是Local文件夹中对应的程序没有配置icon,这个就需要自己手动去添加了。

    展开全文
  • 但是分享出去后,其他人看到要不就不显示图片要不就是显示应用的logo,具体情况如图: 解决方案:刚开始以为是图片太大的问题,但是后来换了一张小的图片发现还是一样的,而且其它地方分享的图片都可以正常...
  • 首先看一下显示效果,如下图所示: 1.首先修改图片,在option对象中加入 下方代码就可实现图片的修改,但是存在bug ...fm=26&...2.图片修改后,只有点击节点的时候才会显示图片,刚加载进去不显
  •  在windows下编译好的QT程序在其他没有安装QT的机器上会出现图标图片无法正常显示的问题。  这时我们可以通过以下方式来解决:  在release文件夹里创建plugins文件夹,并将QT安装目录下的plugins
  • 登入https://ffmpeg.org网站下载ffmpeg,突然想起以前另一台电脑上的chrome浏览器里几个图标按钮不显示,只显示框框,这里显示了,遂好奇这几个图标文件在哪, 查看网页html: 发现标签i的class选择器里的fa,fa...
  • odoo12:上传图片,默认显示图标

    千次阅读 2019-03-04 14:04:03
    图片路径 .\hy\static\src\img\default_image.png 头部声明: import base64 from odoo import api, fields, models, _ from odoo.modules.module import get_module_resource from odoo import tools 方法...
  • wpf 让图标显示在系统托盘

    千次阅读 2016-04-22 10:58:08
    上次做wpf时想把程序运行的图标显示在任务栏,结果发现wpf的系统托盘和winform的不一样,以前的方法不管用了。 网上搜的好多都是winform的资料,wpf的很少。 最后我把我现在做好的整理分享下,方便别人,也方便...
  • menu同时显示图标和文字

    千次阅读 2017-05-17 10:17:49
    Activity中的menu条目,在设置其showAsAction=”never”时,默认只显示文字title,而不会显示图标icon,...// 菜单同时显示图标和文字 @Override public boolean onMenuOpened(int featureId, Menu menu) { if (men
  • 第一:使用element框架的icon时候,开发环境下是没有问题的,打包完以后出现小方块,页面不显示, 解决办法:找到utils.js文件,加 publicPath: ‘…/…/’ function generateLoaders (loader, loaderOptions) { ...
  • LigerUi的Grid中显示Image图片图标

    千次阅读 2013-07-20 05:03:27
    LigerUi的Grid中显示Image图片图标! 以下代码,为grid中显示字段列部分,既可以单击选择图片(只是前台部分),也可以显示图片,并控制图片大小! { display: '图标', name: 'Menu_Icon', align: 'left', ...
  • win7文件夹中的图片使用“XX图标”查看模式显示时,无法正常显示图片缩略图   系统: win7 详细症状描述: 进入含有图片的文件夹,选择“查看”菜单栏中的“超大图标”、“大图标”等模式进行文件显示时...
  • dtree图标显示不出来

    千次阅读 2018-07-04 12:32:06
    问题抛出:图标显示异常,显示不出来。问题追究:把在h5上的页面打开,打开调试模式,找到了显示异常的地方,发现,图标相对路径不对。查看了配置图标路径的地方(在dtree.js中100行左右的位置),发现图片路径是...
  • :hover跟:after应该平时css都有用过,这次想要纯css实现鼠标经过某元素显示一张图片的效果。:after能添加好图片,控制好位置,:hover来控制显示隐藏。重要的就是在鼠标经过时添加:after的实现,写法为:hover::after...
  • 1.图片的url里面不能有中文;2.图片名字里不能有空格;3.待补充。。。。
  • 如何在QT界面显示图片以及修改图标

    千次阅读 2019-07-19 15:32:11
    这几天做项目,做完之后,发现和别人做的相比,我做的实在是太简陋了,于是想办法在QT界面上下了点功夫,首先是图片的插入。 QMovie *movie = new QMovie("D:/Wallpapers/20.gif"); //传路径的时候记得要修改符号 ui...
  • 最近使用NavigationView的时候遇到这个问题,默认情况彩色的图片总是以灰色显示,点击后也是黑色显示,就算明确设置了颜色也不会显示图片原来的彩色,那怎么才能显示图片原色呢,解决这个问题很简单,如下:...
  • 默认情况下,显示在 UINavigationBar 和 UITabBar 中的图标显示的只是图标的轮廓,不透明的部分显示其 TintColor。在没有设置图标显示原始颜色之前显示是这样的: 当前的 tintColor 是 Orange 在设置显示原始颜色...
  • IE8 下面图片路径设置空时,仍然显示一个图片占位符,而且是带个×的图标,怎么它不显示? 正常显示: ![图片说明](https://img-ask.csdn.net/upload/201505/28/1432797744_110998.png) IE8上的显示: ![图片说明...
  • VSCode图标显示异常

    千次阅读 2019-10-30 13:34:05
    其实异常的原因很简单,只是因为在/usr/share/applications/下的code.desktop中对ICON的错误引用路径,默认的路径只有一个code,显然不能指向一个图片文件,对code.desktop文件的分析知道VSCode的安装路径是/usr/share/...
  • iconfont里图标的unicode编码 例如: &#xe601; 改成: \ue601 即可
  • 百度地图自定义图标icon 添加本地图片无法显示问题解决我们在阿里巴巴矢量库找的icon 保存到本地结论 我们在阿里巴巴矢量库找的icon 保存到本地 链接: 阿里巴巴矢量库. 图片: 随便找一个icon 我们设置大小 var ...
  • 按要求要做一个隐藏在后台通知栏的功能,而目前软件开发所用的wpf不含有NotifyIcon这一控件,研究了一下如何调用winform,...预定义几个按钮和通知栏图标    private WinForms.NotifyIcon _notifyIcon;    privat
  • 当我们复制图标时发现直接ctrl+c ctrl+v就可以,这竟然不是图片,而是一种字符,字符怎么能是图片呢,带着疑问我们先来看看这到底是什么。 经过查询,发现这种文本类型的象形符号是有官方定义的名称的,叫做Emoji ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 178,398
精华内容 71,359
关键字:

怎么让图标显示图片