update ts-basic-components-checkboxgroup.md (7716)

Signed-off-by: Nester.zhou <ester.zhou@huawei.com>

en/application-dev/reference/arkui-ts/ts-basic-components-checkboxgroup.md

@@ -58,29 +58,44 @@ struct CheckboxExample {
   build() {
     Scroll() {
       Column() {
-        CheckboxGroup({group : 'checkboxGroup'})
+        Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) {
+          CheckboxGroup({ group: 'checkboxGroup' })
             .selectedColor(0xed6f21)
-          .onChange((itemName:CheckboxGroupResult) => {
+            .onChange((itemName: CheckboxGroupResult) => {
               console.info("TextPicker::dialogResult is" + JSON.stringify(itemName))
             })
+          Text('select all').fontSize(20)
+        }
+
+        Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) {
           Checkbox({ name: 'checkbox1', group: 'checkboxGroup' })
             .select(true)
             .selectedColor(0x39a2db)
             .onChange((value: boolean) => {
               console.info('Checkbox1 change is' + value)
             })
+          Text('Checkbox1').fontSize(20)
+        }
+
+        Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) {
           Checkbox({ name: 'checkbox2', group: 'checkboxGroup' })
             .select(false)
             .selectedColor(0x39a2db)
             .onChange((value: boolean) => {
               console.info('Checkbox2 change is' + value)
             })
+          Text('Checkbox2').fontSize(20)
+        }
+
+        Flex({ justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center }) {
           Checkbox({ name: 'checkbox3', group: 'checkboxGroup' })
             .select(true)
             .selectedColor(0x39a2db)
             .onChange((value: boolean) => {
               console.info('Checkbox3 change is' + value)
             })
+          Text('Checkbox3').fontSize(20)
+        }
       }
     }
   }