def tree_callback_demo(selectedKeys, checkedKeys, halfCheckedKeys):
return [
fac.AntdTitle('selectedKeys：', level=5),
html.Pre(str(selectedKeys)),
fac.AntdTitle('checkedKeys：', level=5),
html.Pre(str(checkedKeys)),
fac.AntdTitle('halfCheckedKeys：', level=5),
html.Pre(str(halfCheckedKeys))
]
def table_callback_demo(currentData, recentlyChangedRow, sorter, filter,
pagination):
ctx = dash.callback_context
return [
fac.AntdTitle('本次回调由{}所触发'.format(
ctx.triggered[0]['prop_id'].split('.')[-1]),
level=3),
fac.AntdDivider(),
fac.AntdTitle('currentData：', level=5),
html.Pre(str(currentData)),
fac.AntdTitle('recentlyChangedRow：', level=5),
html.Pre(str(recentlyChangedRow)),
fac.AntdTitle('sorter：', level=5),
html.Pre(str(sorter)),
fac.AntdTitle('filter：', level=5),
html.Pre(str(filter)),
fac.AntdTitle('pagination：', level=5),
html.Pre(str(pagination))
]
from dash import html
import feffery_antd_components as fac
import feffery_markdown_components as fmc
from server import app
docs_content = html.Div([
fac.AntdBackTop(containerId='docs-content', duration=0.6),
html.Div([
fac.AntdTitle('1 Dash+fac开发环境的准备', id='1 Dash+fac开发环境的准备', level=2),
fmc.FefferyMarkdown(codeStyle='a11y-dark',
markdownStr=open(
'./documents/1 Dash+fac开发环境的准备.md',
encoding='utf-8').read()),
fac.AntdTitle('2 用Dash开发静态页面', id='2 用Dash开发静态页面', level=2),
fmc.FefferyMarkdown(codeStyle='a11y-dark',
markdownStr=open('./documents/2 用Dash开发静态页面.md',
encoding='utf-8').read(),
renderHtml=True),
fac.AntdTitle('3 用Dash开发交互应用', id='3 用Dash开发交互应用', level=2),
fmc.FefferyMarkdown(codeStyle='a11y-dark',
markdownStr=open('./documents/3 用Dash开发交互应用.md',
encoding='utf-8').read(),
renderHtml=True),
html.Div(fac.AntdImage(src=app.get_asset_url('imgs/玩转dash星球二维码.jpg'),
style={
'height': '400px',
'boxShadow':
'0 6px 16px rgb(107 147 224 / 14%)',
'borderRadius': '5px'
}),
docs_content = html.Div([
html.Div([
html.H2('AntdRate(id, className, style, *args, **kwargs)',
style={
'borderLeft': '4px solid grey',
'padding': '3px 0 3px 10px',
'backgroundColor': '#f5f5f5'
}),
fac.AntdBackTop(containerId='docs-content', duration=0.6),
html.Span('主要参数说明：',
id='主要参数说明',
style={
'borderLeft': '4px solid grey',
'padding': '3px 0 3px 10px',
'backgroundColor': '#f5f5f5',
'fontWeight': 'bold',
'fontSize': '1.2rem'
}),
fmc.FefferyMarkdown(markdownStr=open('documents/AntdRate.md',
encoding='utf-8').read()),
html.Div(html.Span('使用示例',
id='使用示例',
style={
'borderLeft': '4px solid grey',
'padding': '3px 0 3px 10px',
'backgroundColor': '#f5f5f5',
'fontWeight': 'bold',
'fontSize': '1.2rem'
}),
style={'marginBottom': '10px'}),
html.Div(
[
fac.AntdTitle('整星选择：', level=5),
fac.AntdRate(count=10),
fac.AntdTitle('半星选择：', level=5),
fac.AntdRate(count=10, allowHalf=True),
fac.AntdDivider(
'基础使用', lineColor='#f0f0f0', innerTextOrientation='left'),
fac.AntdCollapse(fuc.FefferySyntaxHighlighter(
showLineNumbers=True,
showInlineLineNumbers=True,
language='python',
codeStyle='coy-without-shadows',
codeString='''
fac.AntdTitle('整星选择：', level=5),
fac.AntdRate(count=10),
fac.AntdTitle('半星选择：', level=5),
fac.AntdRate(count=10, allowHalf=True)
'''),
title='点击查看代码',
is_open=False,
ghost=True)
],
style={
'marginBottom': '40px',
'padding': '10px 10px 20px 10px',
'border': '1px solid #f0f0f0'
},
id='基础使用',
className='div-highlight'),
html.Div(
[
fac.AntdRate(count=10,
tooltips=[f'等级{i + 1}' for i in range(10)]),
fac.AntdDivider('为各个等级设置说明提示',
lineColor='#f0f0f0',
innerTextOrientation='left'),
fac.AntdCollapse(fuc.FefferySyntaxHighlighter(
showLineNumbers=True,
showInlineLineNumbers=True,
language='python',
codeStyle='coy-without-shadows',
codeString='''
fac.AntdRate(
count=10,
tooltips=[f'等级{i + 1}' for i in range(10)]
)
'''),
title='点击查看代码',
is_open=False,
ghost=True)
],
style={
'marginBottom': '40px',
'padding': '10px 10px 20px 10px',
'border': '1px solid #f0f0f0'
},
id='为各个等级设置说明提示',
className='div-highlight'),
html.Div(
[
fac.AntdRate(
count=10, defaultValue=7.5, allowHalf=True, disabled=True),
fac.AntdDivider(
'只读模式', lineColor='#f0f0f0', innerTextOrientation='left'),
fac.AntdParagraph([
fac.AntdText(' 设置参数'),
fac.AntdText('defaultValue', code=True),
fac.AntdText('及'),
fac.AntdText('disabled=True', code=True),
fac.AntdText('之后，即等价于'),
fac.AntdText('只读模式', strong=True),
fac.AntdText('，适合单纯的星级展示')
]),
fac.AntdCollapse(fuc.FefferySyntaxHighlighter(
showLineNumbers=True,
showInlineLineNumbers=True,
language='python',
codeStyle='coy-without-shadows',
codeString='''
fac.AntdRate(
count=10,
defaultValue=7.5,
allowHalf=True,
disabled=True
)
'''),
title='点击查看代码',
is_open=False,
ghost=True)
],
style={
'marginBottom': '40px',
'padding': '10px 10px 20px 10px',
'border': '1px solid #f0f0f0'
},
id='只读模式',
className='div-highlight'),
html.Div(
[
fac.AntdSpin([
fac.AntdRate(id='rate-demo', count=10, allowHalf=True),
html.Br(),
fac.AntdText('value: ', strong=True),
fac.AntdText(id='rate-demo-output')
],
text='回调中'),
fac.AntdDivider(
'回调示例', lineColor='#f0f0f0', innerTextOrientation='left'),
fac.AntdCollapse(fuc.FefferySyntaxHighlighter(
showLineNumbers=True,
showInlineLineNumbers=True,
language='python',
codeStyle='coy-without-shadows',
codeString='''
fac.AntdSpin(
[
fac.AntdRate(id='rate-demo', count=10, allowHalf=True),
html.Br(),
fac.AntdText('value: ', strong=True),
fac.AntdText(id='rate-demo-output')
],
text='回调中'
)
...
@app.callback(
Output('rate-demo-output', 'children'),
Input('rate-demo', 'value'),
prevent_initial_call=True
)
def rate_demo_callback(value):
return value
'''),
title='点击查看代码',
is_open=False,
ghost=True)
],
style={
'marginBottom': '40px',
'padding': '10px 10px 20px 10px',
'border': '1px solid #f0f0f0'
},
id='回调示例',
className='div-highlight'),
html.Div(style={'height': '100px'})
],
style={'flex': 'auto'}),
html.Div(fac.AntdAnchor(linkDict=[
{
'title': '主要参数说明',
'href': '#主要参数说明'
},
{
'title':
'使用示例',
'href':
'#使用示例',
'children': [
{
'title': '基础使用',
'href': '#基础使用'
},
{
'title': '为各个等级设置说明提示',
'href': '#为各个等级设置说明提示'
},
{
'title': '只读模式',
'href': '#只读模式'
},
{
'title': '回调示例',
'href': '#回调示例'
},
]
},
],
offsetTop=0),
style={
'flex': 'none',
'padding': '20px'
})
],
[
fac.AntdTitle('mode="left"（默认）', level=5),
fac.AntdTimeline(items=[{
'content': '训练数据导入',
'icon': 'md-cloud-upload',
'label': '1小时前'
}, {
'content': '模型训练',
'icon': 'antd-clock-circle',
'label': '58分钟前'
}, {
'content': '模型持久化',
'icon': 'fc-accept-database',
'label': '17分钟前'
}],
pending='模型发布中',
reverse=True,
style={'marginLeft': '20px'}),
fac.AntdTitle('mode="right"', level=5),
fac.AntdTimeline(items=[{
'content': '训练数据导入',
'icon': 'md-cloud-upload',
'label': '1小时前'
}, {
'content': '模型训练',
'icon': 'antd-clock-circle',
'label': '58分钟前'
}, {
'content': '模型持久化',
'icon': 'fc-accept-database',
'label': '17分钟前'
}],
mode='right',
pending='模型发布中',
reverse=True,
style={'marginLeft': '20px'}),
fac.AntdTitle('mode="alternate"', level=5),
fac.AntdTimeline(items=[{
'content': '训练数据导入',
'icon': 'md-cloud-upload',
'label': '1小时前'
}, {
'content': '模型训练',
'icon': 'antd-clock-circle',
'label': '58分钟前'
}, {
'content': '模型持久化',
'icon': 'fc-accept-database',
'label': '17分钟前'
}],
mode='alternate',
pending='模型发布中',
reverse=True,
style={'marginLeft': '20px'}),
fac.AntdDivider('添加节点标签',
lineColor='#f0f0f0',
innerTextOrientation='left'),
fac.AntdCollapse(fuc.FefferySyntaxHighlighter(
showLineNumbers=True,
showInlineLineNumbers=True,
language='python',
codeStyle='coy-without-shadows',
codeString='''
fac.AntdTitle('mode="left"（默认）', level=5),
fac.AntdTimeline(
items=[
{
'content': '训练数据导入',
'icon': 'md-cloud-upload',
'label': '1小时前'
},
{
'content': '模型训练',
'icon': 'antd-clock-circle',
'label': '58分钟前'
},
{
'content': '模型持久化',
'icon': 'fc-accept-database',
'label': '17分钟前'
}
],
pending='模型发布中',
reverse=True,
style={
'marginLeft': '20px'
}
),
fac.AntdTitle('mode="right"', level=5),
fac.AntdTimeline(
items=[
{
'content': '训练数据导入',
'icon': 'md-cloud-upload',
'label': '1小时前'
},
{
'content': '模型训练',
'icon': 'antd-clock-circle',
'label': '58分钟前'
},
{
'content': '模型持久化',
'icon': 'fc-accept-database',
'label': '17分钟前'
}
],
mode='right',
pending='模型发布中',
reverse=True,
style={
'marginLeft': '20px'
}
),
fac.AntdTitle('mode="alternate"', level=5),
fac.AntdTimeline(
items=[
{
'content': '训练数据导入',
'icon': 'md-cloud-upload',
'label': '1小时前'
},
{
'content': '模型训练',
'icon': 'antd-clock-circle',
'label': '58分钟前'
},
{
'content': '模型持久化',
'icon': 'fc-accept-database',
'label': '17分钟前'
}
],
mode='alternate',
pending='模型发布中',
reverse=True,
style={
'marginLeft': '20px'
}
)
'''),
title='点击查看代码',
is_open=False,
ghost=True)
],
id='使用示例',
style={
'borderLeft': '4px solid grey',
'padding': '3px 0 3px 10px',
'backgroundColor': '#f5f5f5',
'fontWeight': 'bold',
'fontSize': '1.2rem'
}),
style={'marginBottom': '10px'}),
html.Div(
[
html.Div([
fac.AntdLayout([
fac.AntdHeader(fac.AntdTitle('页首示例',
level=2,
style={
'color': 'white',
'margin': '0'
}),
style={
'display': 'flex',
'justifyContent': 'center',
'alignItems': 'center'
}),
fac.AntdLayout([
fac.AntdSider(html.Div(fac.AntdTitle(
'侧边栏示例', level=2, style={'margin': '0'}),
style={
'alignItems': 'center',
'display': 'flex',
'height': '100%'
}),
),
style={
'marginBottom': '10px'
}
),
html.Div(
[
html.Div(
[
fac.AntdBackTop(
containerId='back-top-container-demo',
duration=1
),
fac.AntdTitle(
'向下滑动一段距离',
level=4
)
] + [
html.Div(
[
i if i % 2 == 0 else html.Br() for i in range(200)
]
)
],
id='back-top-container-demo',
style={
'maxHeight': '500px',
'overflowY': 'auto',
'position': 'relative',
'backgroundColor': 'rgba(240, 240, 240, 0.2)',
'padding': '20px'
fmc.FefferyMarkdown(markdownStr=open('documents/AntdTitle.md',
encoding='utf-8').read()),
html.Div(html.Span('使用示例',
id='使用示例',
style={
'borderLeft': '4px solid grey',
'padding': '3px 0 3px 10px',
'backgroundColor': '#f5f5f5',
'fontWeight': 'bold',
'fontSize': '1.2rem'
}),
style={'marginBottom': '10px'}),
html.Div(
[
fac.AntdParagraph([
fac.AntdTitle('一级标题', level=1),
fac.AntdTitle('二级标题', level=2),
fac.AntdTitle('三级标题', level=3),
fac.AntdTitle('四级标题', level=4),
fac.AntdTitle('五级标题', level=5)
]),
fac.AntdDivider('不同的标题级别',
lineColor='#f0f0f0',
innerTextOrientation='left'),
fac.AntdParagraph([
fac.AntdText(' AntdTitle', strong=True),
fac.AntdText('拥有'),
fac.AntdText('AntdText', strong=True),
fac.AntdText('的所有常规渲染模式，参数同样适用，这里就不再赘述，仅展示不同'),
fac.AntdText('level', strong=True),
fac.AntdText('参数下的效果'),
html.Img(
src=
'https://img.shields.io/pypi/v/feffery-antd-components.svg?color=dark-green',
style={
'height': '19px',
'transform': 'translateY(-1px)'
})
]),
style={'listStyleType': 'circle'})
]),
fac.AntdParagraph([
fac.AntdText('📦', style={'fontSize': '26px'}),
fac.AntdText('安装', strong=True, style={'fontSize': '26px'}),
],
id='安装'),
fac.AntdTitle('最新稳定版本：', level=5),
fac.AntdText(f'pip install feffery-antd-components=={fac.__version__}',
keyboard=True,
copyable=True),
fac.AntdTitle('最新开发版本：', level=5),
fac.AntdText(
'pip install git+https://github.com/CNFeffery/feffery-antd-components.git',
keyboard=True,
copyable=True),
html.Br(),
fac.AntdText('国内github镜像加速下载方式：'),
html.Br(),
fac.AntdText(
'pip install git+https://hub.fastgit.org/CNFeffery/feffery-antd-components.git',
keyboard=True,
copyable=True),