Material Icons 搜索器
本帖最后由 我心飞翔1995 于 2024-9-19 12:35 编辑日常开发NiceGUI程序的过程中，发现icon用的Material Icons图标字体需要访问谷歌，中国大陆没法访问，我又一直遵纪守法。没办法，只好想办法自制一个Material Icons图标字体搜索预览工具。代码是基于NiceGUI做的，后续NiceGUI官方会推出Icon模块，图标字体使用会方便一些，目前可以先用这个顶一顶。首先要从 https://github.com/google/material-design-icons/archive/master.zip 下载Material Icons字体的源代码，然后解压。接着就是用下面的代码生成图标字体的全部名字字典，里面的main path 部分记得替换，根据上面的解压目录修改。当然，我这边也生成了一份结果文件，懒得生成的可以点我下载import os
icon_name_dict = {}
map_name1 = {
'materialiconstwotone': '',
'materialicons': '',
'materialiconsoutlined': 'o_',
'materialiconsround': 'r_',
'materialiconssharp': 's_',
}
map_name2 = {
'materialsymbolsoutlined':'sym_o_',
'materialsymbolsrounded':'sym_r_',
'materialsymbolssharp':'sym_s_'
}
# main path:
sym_path = 'e:/Projects/material-design-icons-master/symbols/android'
src_path = 'e:/Projects/material-design-icons-master/src'
result_path = f'{os.path.dirname(os.path.abspath(__file__))}/result.txt'
# search name:
# https://fonts.google.com/icons?icon.set=Material+Icons
# source code link:
# https://github.com/google/material-design-icons/archive/master.zip
for names in os.listdir(src_path):
for name in os.listdir(src_path+f'/{names}'):
icon_name_dict.update({name: []})
for typ in os.listdir(src_path+f'/{names}/{name}'):
icon_name_dict.append(map_name1)
for name in os.listdir(sym_path):
if name not in icon_name_dict.keys():
icon_name_dict.update({name: []})
for typ in os.listdir(sym_path+f'/{name}'):
icon_name_dict.append(map_name2)
for k in icon_name_dict.keys():
icon_name_dict = list(set(icon_name_dict))
with open(result_path, 'w') as f:
f.write(str(icon_name_dict))
生成的结果文件和下面的代码放在同一目录执行即可，代码需要nicegui库，会python自己安装，这里不赘述：
from nicegui import ui
import os
result = {}
with open(f'{os.path.dirname(os.path.abspath(__file__))}/result.txt') as f:
result = eval(f.read())
icon_name_list = list(result.keys())
with ui.row():
icon_name = ui.select(icon_name_list, value='3d_rotation',label='icon name:', with_input=True).classes('w-64')
zoom_spec = ui.switch().tooltip('show bigger icon')
@ui.refreshable
def icon_type():
icon_prefix = ui.select(result, value=result, label='icon type:').classes('w-64')
icon_prefix.bind_visibility_from(zoom_spec,'value')
@ui.refreshable
def icon_type_card():
with ui.card().bind_visibility_from(zoom_spec,'value'):
with ui.column():
ui.label(icon_prefix.value+icon_name.value+':')
ui.icon(icon_prefix.value+icon_name.value, size='10em')
icon_type_card()
icon_prefix.on_value_change(icon_type_card.refresh)
icon_type()
@ui.refreshable
def demo():
with ui.card().bind_visibility_from(zoom_spec,'value',lambda x:not x):
ui.label(icon_name.value+':')
with ui.row():
for i in sorted(result):
with ui.icon(i+icon_name.value, size='3em'):
ui.tooltip(i+icon_name.value).tailwind.font_size('sm')
demo()
icon_name.on_value_change(demo.refresh)
icon_name.on_value_change(icon_type.refresh)
ui.run(native=True,title='Material Icons Search')
界面如图：
https://private-user-images.githubusercontent.com/16256910/368498186-fb3885e9-df9c-4e7a-a879-33f53bbb5ccf.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjY2NTIwNTYsIm5iZiI6MTcyNjY1MTc1NiwicGF0aCI6Ii8xNjI1NjkxMC8zNjg0OTgxODYtZmIzODg1ZTktZGY5Yy00ZTdhLWE4NzktMzNmNTNiYmI1Y2NmLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA5MTglMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwOTE4VDA5MjkxNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTg4NTg1MTM2MjQ4MzczNGM0MWQzZTcxMTJmNDg3M2UxNWYzY2ExMzM3YmFjMWE2MjAzMWNlZmNmNjYwZDlmZWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.P2UQtPskJ4oy20dJooTDQOoa_o988v3cLpSY0GNVRmU
https://private-user-images.githubusercontent.com/16256910/368498476-d26be507-539d-49f0-a9fb-361e4979f562.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjY2NTIwNTYsIm5iZiI6MTcyNjY1MTc1NiwicGF0aCI6Ii8xNjI1NjkxMC8zNjg0OTg0NzYtZDI2YmU1MDctNTM5ZC00OWYwLWE5ZmItMzYxZTQ5NzlmNTYyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA5MTglMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwOTE4VDA5MjkxNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWFjMDY3NGM5ZWMzMzg2MjZmYmVlOGQwMDljNjhjMmVlMWEwMmQ0YmExNWRjZjlhYWJkMzgwZGVlOTI3MDY3ZjImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.Kcw8LMNa1YQi3dCvSkgaECeL3rik6PzQnb4OJcaOuEg
PS：2024/09/19，更新了新的界面，分为三种搜索方式，指定图标的全部风格预览、指定图标名称和风格的大图预览、指定图标风格和名称的大图预览。
from nicegui import ui
import os
result = {}
with open(f'{os.path.dirname(os.path.abspath(__file__))}/result.txt') as f:
result = eval(f.read())
icon_name_dict = result
icon_name_list = list(icon_name_dict.keys())
icon_name_dict_typed = {'':[],'o_':[],'r_':[],'s_':[],'sym_o_':[],'sym_r_':[],'sym_s_':[],}
for i in icon_name_list:
for k in icon_name_dict:
icon_name_dict_typed.append(i)
type_name_map = {'':'Filled',
'o_':'Outline',
'r_':'Round',
's_':'Sharp',
'sym_o_':'Outline symbol',
'sym_r_':'Round symbol',
'sym_s_':'Sharp symbol',}
current_name = ''
current_type = ''
def all_show(icon_name = None,icon_type = None):
with ui.card():
ui.label(icon_name+':')
with ui.column():
with ui.row() as row1:
label1= ui.label('This name has no filled icon.')
with ui.row() as row2:
label2= ui.label('This name has no styled icon.')
with ui.row() as row3:
label3= ui.label('This name has no symbol icon.')
for prefix in icon_type:
if prefix in ['o_','r_','s_']:
label2.set_text('Styled:')
with row2,ui.icon(prefix+icon_name, size='3em').on('click',lambda :(ui.clipboard.write(prefix+icon_name),ui.notify('name copied!'))):
ui.tooltip(prefix+icon_name).tailwind.font_size('sm')
elif prefix in ['sym_o_','sym_r_','sym_s_']:
label3.set_text('Symbol:')
with row3,ui.icon(prefix+icon_name, size='3em').on('click',lambda :(ui.clipboard.write(prefix+icon_name),ui.notify('name copied!'))):
ui.tooltip(prefix+icon_name).tailwind.font_size('sm')
else:
label1.set_text('Filled:')
with row1,ui.icon(prefix+icon_name, size='3em').on('click',lambda :(ui.clipboard.write(prefix+icon_name),ui.notify('name copied!'))):
ui.tooltip(prefix+icon_name).tailwind.font_size('sm')
def bigger_show(icon_name = None,icon_type = None):
with ui.card():
with ui.column():
ui.label(icon_name+f' of {type_name_map}'+':')
with ui.icon(icon_type+icon_name, size='10em').on('click',lambda :(ui.clipboard.write(icon_type+icon_name),ui.notify('name copied!'))):
ui.tooltip(icon_type+icon_name).tailwind.font_size('sm')
def title():
with ui.row():
ui.link('all_type','/')
ui.link('bigger_type','/bigger')
ui.link('bigger_type_fisrt','/bigger_first')
@ui.page('/',title='all type')
def page_index():
title()
icon_name = ui.select(icon_name_list, value= current_name if (current_name in icon_name_list) else icon_name_list ,label='icon name:', with_input=True).classes('w-64')
@ui.refreshable
def show():
all_show(icon_name=icon_name.value,icon_type=icon_name_dict)
show()
icon_name.on_value_change(show.refresh)
icon_name.on_value_change(lambda e:globals().update({'current_name':e.sender.value}))
@ui.page('/bigger',title='bigger type')
def page_bigger():
title()
icon_name = ui.select(icon_name_list, value = current_name if (current_name in icon_name_list) else icon_name_list,label='icon name:', with_input=True).classes('w-64')
@ui.refreshable
def show():
current_type_list = icon_name_dict
icon_type_name = ui.select({ i:type_name_map for i in current_type_list}, value= current_type if(current_type in current_type_list) else current_type_list , label='icon type name:',with_input=True).classes('w-64')
icon_type_name.bind_value_to(globals(),'current_type')
@ui.refreshable
def inner_show():
bigger_show(icon_name=icon_name.value,icon_type=icon_type_name.value)
inner_show()
icon_type_name.on_value_change(inner_show.refresh)
show()
icon_name.on_value_change(show.refresh)
icon_name.on_value_change(lambda e:globals().update({'current_name':e.sender.value}))
@ui.page('/bigger_first',title='bigger_type_fisrt')
def page_bigger_first():
title()
icon_type_name = ui.select(type_name_map, value=current_type,label='icon type name:', with_input=True).classes('w-64')
icon_type_name.bind_value_to(globals(),'current_type')
@ui.refreshable
def show():
current_name_list = icon_name_dict_typed
icon_name = ui.select(current_name_list, value= current_name if current_name in current_name_list else current_name_list, label='icon name:',with_input=True).classes('w-64')
@ui.refreshable
def inner_show():
bigger_show(icon_name = icon_name.value, icon_type= icon_type_name.value)
inner_show()
icon_name.on_value_change(inner_show.refresh)
icon_name.on_value_change(lambda e:globals().update({'current_name':e.sender.value}))
show()
icon_type_name.on_value_change(show.refresh)
ui.run(native=True,title='Material Icons Search')
xiaomianao 发表于 2024-9-19 07:44
没下载啊？
审核导致链接被吞掉了
https://github.com/python-and-fiction/chinese_guide_of_nicegui_for_beginner/blob/main/src/chinese_guide_of_nicegui_for_beginner/result.txt
点不了下载啊{:1_893:}
页:
[1]