为ButtonGroup中的一个单选按钮命名

Question

根据下面这张图片，我从CleanMordern项目中得到的信息，我如何使用CSS来设计我的单选按钮，让它看起来和Shai的一样，并且让每个按钮上的动作在按下时显示不同的容器。

ButtonGroup barGroup = new ButtonGroup();
    RadioButton all = RadioButton.createToggle("All", barGroup);
    all.setUIID("SelectBar");
    RadioButton featured = RadioButton.createToggle("Featured", barGroup);
    featured.setUIID("SelectBar");
    RadioButton popular = RadioButton.createToggle("Popular", barGroup);
    popular.setUIID("SelectBar");
    RadioButton myFavorite = RadioButton.createToggle("My Favorites", barGroup);
    myFavorite.setUIID("SelectBar");
    Label arrow = new Label(res.getImage("news-tab-down-arrow.png"), "Container");

    add(LayeredLayout.encloseIn(
            GridLayout.encloseIn(4, all, featured, popular, myFavorite),
            FlowLayout.encloseBottom(arrow)
    ));

Answer 1

你可以在设计师工具中打开主题文件，然后从那里复制样式。我实现了这一点，使用图像背景，以保持一些像素的底部箭头的自由。

如果你看一下主题，你会看到我只是把一个背景图片，是纯红色的顶部，有一个白色的底部。然后，我有一个单独的 "箭头 "的图像，这是动画与代码，每次点击选定的按钮。其他一切都只是颜色和字体，这是微不足道的。