Creating a Widget containing Text and calculations

35 Views Asked by At

I want to create "Swipable Cards" (Carousel) Containing some Text and at the bottom a field where I can choose some numbers to give points to the specific tasks (given points divided by number of tasks).

The cards contain different categories with titles and descriptions. for each title i can give 5 points but also, i want to mark some tasks as "not relevant" which can't be counted as tasks (must be ignored in the calculation) (See screenshot)

Basically, I want to create a List of Tasks

thanks

screenshot

import 'package:flutter/material.dart';
import 'package:auto_size_text/auto_size_text.dart';

class CustomCard extends StatefulWidget {
  CustomCard({super.key});

  @override
  State<CustomCard> createState() => _CustomCardState();
}

class _CustomCardState extends State<CustomCard> {
  int selectedValue = 0;

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
          boxShadow: [
            BoxShadow(
              color: Colors.grey.shade300,
              blurRadius: 10, // Shadow position
            ),
          ],
          color: Theme.of(context).canvasColor,
          borderRadius: BorderRadius.circular(15)),
      margin: EdgeInsets.fromLTRB(20, 0, 20, 0),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Expanded(
              flex: 20,
              child: Container(
                margin: EdgeInsets.symmetric(horizontal: 5),
                child: Align(
                  alignment: Alignment.center,
                  child: AutoSizeText(
                    'Sozialkommunikative Kompetenzen gegenüber PatientInnen / Klientinnen / BewohnerInnen / Angehörigen',
                    style: TextStyle(
                      fontSize: 16,
                    ),
                  ),
                ),
              )),
          Expanded(
            child: Container(
                margin: EdgeInsets.symmetric(horizontal: 5),
                child: AutoSizeText(
                  '1. Zeigt in der Kommunikation mit PatientInnen/KlientInnen einen wertschätzenden, respektvollen Umgang, hört aktiv zu',
                  style: TextStyle(
                      fontSize: 18,
                      fontWeight: FontWeight.bold,
                      color: Theme.of(context).primaryColorDark),
                )),
            flex: 30,
          ),
          Expanded(
            flex: 70,
            child: Container(
              color: Colors.grey.shade100,
              margin: EdgeInsets.symmetric(horizontal: 10),
              child: Scrollbar(
                thumbVisibility: true,
                child: ListView(
                  itemExtent: 50,
                  shrinkWrap: true,
                  children: [
                    Text(
                        'informiert sich über formelle und informelle Regeln und hält diese ein'),
                    Text('hält sich an konventionelle Umgangsformen'),
                    Text('zeigt sich kritikfähig'),
                    Text('zeigt sich konfliktfähig'),
                    Text('zeigt sich konsensfähig'),
                    Text(
                        'nimmt an Besprechungen, Visiten, Fallbesprechungen etc. teil und bringt sich ein'),
                    Text('denkt vernetzt und fachübergreifend'),
                    Text('hält sich an therapeutische Teamvereinbarungen'),
                    Text('reflektiert seine Rolle im interdisziplinären Team'),
                    Text(
                        'informiert sich über formelle und informelle Regeln und hält diese ein'),
                    Text('hält sich an konventionelle Umgangsformen'),
                    Text('zeigt sich kritikfähig'),
                    Text('zeigt sich konfliktfähig'),
                    Text('zeigt sich konsensfähig'),
                    Text(
                        'nimmt an Besprechungen, Visiten, Fallbesprechungen etc. teil und bringt sich ein'),
                    Text('denkt vernetzt und fachübergreifend'),
                    Text('hält sich an therapeutische Teamvereinbarungen'),
                    Text('reflektiert seine Rolle im interdisziplinären Team'),
                  ],
                ),
              ),
            ),
          ),
          Container(
            width: double.infinity,
            height: 80,
            child: Column(
              children: [
                const Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    Text('5'),
                    Text('4'),
                    Text('3'),
                    Text('2'),
                    Text('1'),
                    Text('n.r.'),
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    Radio(value: null, groupValue: null, onChanged: null),
                    Radio(value: null, groupValue: null, onChanged: null),
                    Radio(value: null, groupValue: null, onChanged: null),
                    Radio(value: null, groupValue: null, onChanged: null),
                    Radio(value: null, groupValue: null, onChanged: null),
                    Radio(value: null, groupValue: null, onChanged: null),
                  ],
                )
              ],
            ),
          ),
          Container(
            width: double.infinity,
            height: 70,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                Icon(Icons.keyboard_double_arrow_left),
                Text('swipe'),
                Icon(Icons.keyboard_double_arrow_right)
              ],
            ),
          )
        ],
      ),
    );
  }
}
0

There are 0 best solutions below