New Component: Streamlit-antd-components,more widgets to extend streamlit!

A Streamlit component to display Antd-Design.
Check out the Demo APP for more example.

Check out the Github for detail usage.

16 Likes

Hi @ji_haoran

This seems an awesome component. I have a question though. How many levels of nesting can this component support. The screenshot displays 2 levels…

Cheers

1 Like

Hi @ji_haoran

This is truly amazing!!! I see that you have really put effort into building this very useful component.

I have 1 observation though: If I click in the middle of a nested chain (say… table22), the entire chain gets selected, right up to table 55). Ideally, it should only select up to table22, right?

Nevertheless, awesome component. Thank you very much.

God Bless :slight_smile:

1 Like

in antd_tree,you can set checkbox_strict=True(that means parent key and children keys are not associated) to achieve this effect。

2 Likes

Hi @ji_haoran,

I tried installing your component on my server (using pip install streamlit-antd-components) - It doesn’t install correctly. I get this error message:

I tried uninstalling and re-installing - it didn’t work. How can I make it work?

Thanks in advance.

Cheers

1 Like

I renamed all the component names, as well as some parameter names, so when you update the new version, the original component names will not be available, you will need to change the component names and parameters in your code.
For example,rename antd_tree to tree in your code.

1 Like

Hi @ji_haoran, thank you so much for your prompt response. The problem is solved.

Cheers :slight_smile:

1 Like

太厉害了,特别是可分组的 tree select 真的是解了燃眉之急。

一个野心的目标:有无可能做一个抽象对接到 Ant Design Charts,极大扩展其画图能力。

1 Like

ji, i want to congratulations you for updating the component. Your work is amazing!! I’m super impressed!

1 Like

Thank you for liking this component. This component is used to extend the steramlit component, so that users can use more components to build more complex interfaces. I hope this component is useful to you.

1 Like

现在已经有了streamlit-echarts这个组件,可以实现在streamlit中使用echarts来画图,也是极大拓展了streamlit的交互式绘图能力。交互式绘图,我基本是就是使用这个组件的。

2 Likes

Awesome componente, I’ll be definetly using it!

1 Like

Adding Ant Design components to Streamlit is a fantastic idea! Your code base is well organized too!

Fyi, so far the components I have tested work well with streamlit-float. I have only tested the Alert banner and Menu. You can see an example of a floating Alert in the demo.

3 Likes

The floating Alert is amazing!

2 Likes

Could you please provide an example of catching an event when clicked on a child item and get its parent hierarchy please.
Also is there a way we can expand the tree by default so we can save some clicks.
Thanks
Sai

1 Like

The tree component has open_index params to expand the default items, when you set open_index params,you should set open_all=False.

1 Like

My friend, first I want to thank you for dedicating your time to an extremely useful element for the community to use.

I wanted to know if you could help me with the following situation: When using it, I noticed that the elements have a default background color for the app. Is it possible to remove this background or make it transparent?

Exemple:
image

1 Like

Can you show a piece of code and what components are used?

1 Like

unfortunately, at the moment, I don’t have access to the computer that has the code now :confused: I can send it to you on 9/11 when i’ll have acess to the computer with the code hahaha

Anyway, it was something like this:
image

Remembering that I styled my sidebar with css. So it doesn’t use the secondary color configured in the stremlit app. I believe that the component uses the secondary color to use the background color on the buttons and etc.

If you can help me with this, i’ll be grateful!

1 Like

The issue has fixed in latest version (0.1.21),so all components has redesign, you can update the package to solve the problem.
Hope it helpful !

2 Likes