您可以使用choice_attr向这些选择添加特定的CSS类，并在CSS中使用相应的类定义来根据需要呈现这些选择：

public function buildForm(FormBuilderInterface $builder,array $options): void
{
    $builder->add('risk',ChoiceType::class,[
        'choices' => 
            'level.0' => 1,'level.1' => 2,'level.2' => 3,'level.3' => 4,'level.4' => 5
        ],'choice_attr' => function($choice,$key,$value) {
           return ['class' => 'level_'.strtolower($key)];
        }
    ]);
}

CSS ：（仅以文本颜色为例，其余取决于您）

.level_0 {
    color: red;
}
.level_1 {
    color: orange;
}
.level_2 {
    color: yellow;
}
.level_3 {
    color: light_green;
}
.level_4 {
    color: green;
}

首先感谢Veve，但他的回答很短而且还没有完成，我必须通过添加Expanded => true和multiple => false将选择类型转换为单选按钮。有关更多信息，请参见：Symfony Select Tag

$builder->add('risk',[
     'choices' => [
        'level-0' => 1,'level-1' => 2,'level-2' => 3,'level-3' => 4,'level-4' => 5
     ],$value) {
             return ['class' => 'risk_'.strtolower($key)];
         },'expanded' => true,'multiple' => false,'placeholder' => false
]);

然后我使用了一个表格来显示表单中的值。

<table class="table risk-colors-table">
    <tr>
        <td class="risk_level-text">Text</td>
        <td class="risk-option level-0">{{ form_row(form.risk[0])}}</td>
        <td class="risk-option level-1">{{ form_row(form.risk[1])}}</td>
        <td class="risk-option level-2">{{ form_row(form.risk[2])}}</td>
        <td class="risk-option level-3">{{ form_row(form.risk[3])}}</td>
        <td class="risk-option level-4">{{ form_row(form.risk[4])}}</td>
    </tr>
</table>

我添加了此CSS，以使用之前添加的类进行漂亮的设计并隐藏单选按钮和标签：

.risk_level-text {
   vertical-align: center!important;
}

.level-0 {
    background: #63d06c;
}

.level-1 {
    background: #a7e35c;
}

.level-2 {
    background: #fdf74d;
}

.level-3 {
    background: #f0a725;
}

.level-4 {
    background: #ee0018;
}

.risk-colors-table {
    width: 100%;
    padding-left: 2px;
}

.risk-colors-table tr {
    border:2px solid #d9d9d9;
}

.risk-option {
    float: right;
    vertical-align: center!important;
    border-radius: 25px;
    margin-bottom: 25px;
    height: 28px;
    width:19%;
}

.risk-option label {
    visibility: hidden;
    text-align: center;
    color:white;
    vertical-align:middle;
}

.risk-option.active {
    border:3px solid #3362b1;
}

.risk-colors-table td {
    margin: 10px 1px;
}

在JavaScript中，我必须添加此功能才能在单击表td时激活单选按钮：

$(function () {
    $('.risk-option').click(
        function () {
            $(this).addClass('active').siblings().removeClass('active');
            var $radioBtn = $('.risk-option.active input[type="radio"]');

            if ($radioBtn.is(':checked') === true) {
                $radioBtn.filter('input[type="radio"]').prop('checked',true);
            }
        }
    );
});

我做了很多工作，希望它能对某人有所帮助。最终结果与我的平均问题中图片中的显示方式完全一样。