Flutter Appbar?

Hallo habe vor kurzem die compiledSdkVersion auf 33 stellen müssen, da es einige Pakete benötigen. Und ab diesem Zeitpunkt kann ich die App nicht mehr starten.

Fehler:

The relevant error-causing widget was:
  AppBar AppBar:file:///D:/xxx/xxx/lib/screens/home_page.dart:18:15

Code:

appBar: AppBar(
        title: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: const [
            Text(
              "Home",
            ),
          ],
        ),
      ),

Kann mir jemand helfen, ich habe keine Ahnung was ihm da nicht passt.

1 Antwort

FabainMai

13.02.2023, 20:39

Mit dem Error kann man nichts anfangen, da steht nur der "Stacktrace" der Error kommt eigentlich immer danach. Wenn da keiner mehr kommt gehe in main.dart und importiere das:

import 'package:stack_trace/stack_trace.dart' as stack_trace;

danach mache in void main das:

FlutterError.demangleStackTrace = (StackTrace stack) {
  if (stack is stack_trace.Trace) return stack.vmTrace;
  if (stack is stack_trace.Chain) return stack.toTrace().vmTrace;
  return stack;
};

dann wird dir der Stacktrace eigentlich korrekt angezeigt. dann kannst du den error posten . Die appbar müsste eigentlich funktionieren.

Hallo, ich habe ein Programm das so aussehen soll:

Ich habe diesen Code:

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Colors.teal,
        body: SafeArea(
          child: Row(
            children: <Widget>[
              Container(
                width: 100,
                color: Colors.red,
              ),

              Column(
                children: <Widget>[
                  Container(
                    width: 100,
                    height: 100,
                    color: Colors.yellow,
                  ),
                  Container(
                    width: 100,
                    height: 100,
                    color: Colors.green,
                  ),
              Container(
                width: 100,
                color: Colors.yellowAccent,
                  ),
                ],
              ),
            ],
          )
          ),
        ),
      );
  }
}

Der letzte Container (yellowAccent) wird nicht angezeigt auf dem Emulator. Kann mir bitte jemand helfen?

Mfg Elias Brüggen

...zur Frage

Flutter Data from API?

Hey, will Daten von meiner erstellten API ausgeben in meiner App.

Code:

fetchData() async {
    final response = await http.get(Uri.parse('http://localhost/list.json'));
    return json.decode(response.body);
  }

FutureBuilder(
            future: fetchData(),
            builder: (BuildContext context, AsyncSnapshot snapshot){
              if(snapshot.hasError){
                return Center(
                  child:Text("Error"),
                );
              }
              if(snapshot.hasData){
                return ListView.builder(
                  itemCount: snapshot.data.length, 
                    itemBuilder: (BuildContext context, int index){
                  return Row(
                    children: [
                      Expanded(
                        child: Container(
                        child: Column(
                          children: [
                            Text(snapshot.data[index]['id']),
                            SizedBox(height: 10,),
                            Text(snapshot.data[index]['name']),
                            
                          ],
                        ),
                        ),
                      ),
                    ],
                  );
                });
              }
              return Center(child: CircularProgressIndicator(),);
            },
          ),

Jedoch bekomm ich als Ausgabe "Error". Woran kann das liegen? Die API kann ich mit Postmann abfragen.

...zur Frage

Wie kann ich mehrere Childs in einem Container usen?

Hallo Leute,

Ich ich versuche gerade in Flutter mehrere childs in einem Container zu usen. Hab es schon mit raw, column..etc.. versucht ging aber nicht. Ich hoffe ihr könnt mir da weiterhelfen!

Expanded(
            child: PageView(
              controller: page,
              children: [
                Container(
                  color: const Color(0xFF171716),
                  child: Padding(
                    padding: const EdgeInsets.all(20.0),
                    child: TextField(
                      cursorColor: Colors.black,
                      style: const TextStyle(color: Colors.white),
                      decoration: InputDecoration(
                        hintText: 'Paste here your Youtube-Link',
                        filled: true,
                        fillColor: const Color(0xFF12DE78),
                        border: OutlineInputBorder(
                          borderSide: BorderSide.none,
                          borderRadius: BorderRadius.circular(50),
                        ),
                      ),
                    ),
                  ),
                  child: TextButton(
                    // ignore: sort_child_properties_last
                    child: const Text(
                      'LogIn',
                      style: TextStyle(fontSize: 20.0),
                    ),
                    color: Colors.blueAccent,
                    textColor: Colors.white,
                    onPressed: () {},
                  ),
                ),

...zur Frage

Welche Programmiersprache zur App-Programmierung mit Kindern?

Ich bin Lehrer und würde gern mit 12jährigen Apps programmieren, die auf deren Smartphones dann auch wirklich laufen.

Nun sind Ferien und ich möchte mir die dazu nötige Sprache draufschaffen.

Sollte ich Javascript, Kotlin, Swift oder Dart lernen/verwenden?

...zur Frage

TabBar mit Dart/Flutter?

Hallo bin gerade dabei eine App mit Flutter zu programmieren und wollte gerade eine TabBar machen, jedoch funktioniert es nicht. Also ich bekomme es hin das sie angezeigt wird, aber sobald ich das einbaue das pro Tab eine andere Seite angezeigt wird, wird mir die Tabbar 5 mal angezeigt. Kann mir jemand helfen und sagen was das Problem ist.

Hier mein Code:

class Uebersicht extends StatelessWidget {
  const Uebersicht({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 4,
      child: Scaffold(
        appBar: AppBar(
          title: Text("Übersicht"),
          bottom: TabBar(
            tabs: [
              Tab(text: 'Home', icon: Icon(Icons.home)),
              Tab(text: 'Videos', icon: Icon(Icons.article_outlined)),
              Tab(text: 'Bilder', icon: Icon(Icons.add_call)),
              Tab(text: 'About', icon: Icon(Icons.backpack_outlined)),
            ],
          ),
        ),
        drawer: Sidebar(),
        body: TabBarView(
          children: [
            Uebersicht(),
            Videos(),
            Bilder(),
            About(),
          ],
        ),
      ),
    );
  }

Main.dart

class ApoSys extends StatelessWidget {
  const ApoSys({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'ApoSys-Notdienst System für Apotheken',
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      home: Uebersicht(),
      routes: {
        'home': (context) => Uebersicht(),
        'apotheken': (context) => Apotheken(),
        'bezirk_melk': (context) => Bezirk_Melk(),
        'bezirk_amstetten': (context) => Bezirk_Amstetten(),
        'bezirk_scheibbs': (context) => Bezirk_Scheibbs(),
        'kalender': (context) => Kalender(),
        'notdienst': (context) => Notdienst(),
        'notrufe': (context) => Notrufe(),
        'videos': (context) => Videos(),
        'bilder': (context) => Bilder(),
        'about': (context) => About(),
      },
    );
  }
}

Die Widget für Videos, Bilder und About existieren, es funktioniert auch das die Seiten angezeigt werden, jedoch wird wie beschrieben die TabBar 6 mal angezeigt.

Danke für die Antworten im Vorraus!

...zur Frage

Html und JavaScript Code?

Hallo zusammen,

ich möchte für eine Webseite ein Widget erstellen, das die nächsten Veranstaltungen anzeigen soll. Diese werden in dem Code dann hinzugefügt. Auf dem Widget welches auf der Webseite angezeigt wird dürfen aber immer nur zwei Veranstaltungen gleichzeitig dargestellt werden. Das Datum der Veranstaltungen soll immer mit dem aktuellen Datum verglichen werden. Ist das Datum der ganz oben also an erster Stelle stehenden Veranstaltung seit einem Tag überschritten soll diese gesamte Veranstaltung ausgeblendet werden. Die darunter stehende also an zweiter Stelle befindliche Veranstaltung rückt dann an erste Stelle und an Zweite Stelle rückt dann eine bisher noch nicht angezeigt Veranstaltung. Immer so das halt nur zwei Veranstaltungen gleichzeitig angezeigt werden. Das Datum vergleichen und ein/ausblenden und neu ordnen der Veranstaltungen funktioniert bei meinem Code noch nicht so ganz. Kann mir dabei bitte jemand helfen. Wenn das möglich ist am besten den Code so anpassen damit diese Funktionen so funktionieren.

Mit freundlichen Grüßen

Tim

Hier ist mein aktueller Code davon:

<!DOCTYPE html>

<html>

<head>

<style>

/* Stil für das Widget */

.event-widget {

border: 1px solid #ccc;

padding: 6px;

max-width: 215px; /* Breiteres Widget */

background-color: #f7f7f7;

}

/* Stil für die Hellschwarze Hauptüberschrift */

.event-widget h3 {

color: #454545; /* Hellschwarz */

font-size: 18px; /* Kleinere Schriftgröße für die Hauptüberschrift */

text-align: center; /* Zentriert den Text */

margin: 0; /* Entfernt den oberen und unteren Abstand der Überschrift */

}

/* Stil für die einzelnen Veranstaltungen */

.event-widget ul li {

margin-bottom: 10px; /* Fügt einen Abstand zwischen den Veranstaltungen hinzu */

padding-bottom: 5px; /* Fügt zusätzlichen Abstand zwischen dem Trennungsstrich und dem Text hinzu */

}

/* Fügt einen Trennungsstrich zwischen den Veranstaltungen hinzu */

.event-item + .event-item {

border-top: 1px solid #ccc;

margin-top: 10px;

padding-top: 5px;

}

/* Stil für die übrigen Texte */

.event-title {

color: #8B0000; /* Weinrot */

font-size: 15px; /* Kleinere Schriftgröße für den übrigen Text */

}

/* Stil für die Uhrzeit */

.event-time {

font-weight: bold;

font-size: 12px; /* Kleinere Schriftgröße */

}

</style>

</head>

<body>

<h3>Nächste Veranstaltungen</h3>

<strong class="event-title">Seniorentreff mit Kaffee und Kuchen:</strong>

<br>

Datum: 2023-11-09

<br>

Zeit: 14:30 - 16:00 Uhr

<br>

Ort: Feuerwehrhaus

</li>

<strong class="event-title">Volkstrauertag:</strong>

<br>

Datum: 2023-11-19

<br>

Zeit: 15:00 - 16:00 Uhr

<br>

Ort: Am Ehrenmal Ahrenshöft

</li>

<strong class="event-title">Seniorentreff mit Kaffee und Kuchen:</strong>

<br>

Datum: 2023-12-14

<br>

Zeit: 14:30 - 16:00 Uhr

<br>

Ort: Feuerwehrhaus

</li>

</ul>

</div>

function updateEvents() {

const eventList = document.getElementById("event-list");

const events = eventList.getElementsByClassName("event-item");

const currentDate = new Date();

const displayedEvents = 2;

for (let i = 0; i < events.length; i++) {

const eventDateString = events[i].querySelector("br:nth-child(2)").textContent.replace("Datum: ", "");

const eventDate = new Date(eventDateString);

// Überprüfe, ob das Datum um einen Tag überschritten ist

if (eventDate < currentDate) {

events[i].style.display = "none"; // Verstecke vergangene Veranstaltungen

} else {

events[i].style.display = "block"; // Zeige zukünftige Veranstaltungen

}

// Überprüfe, ob die maximale Anzahl von angezeigten Veranstaltungen erreicht ist

if (i >= displayedEvents) {

events[i].style.display = "none";

}

// Aktualisiere die Veranstaltungen beim Laden der Seite

document.addEventListener("DOMContentLoaded", updateEvents);

</script>

</body>

</html>

...zur Frage

Welche Technologien eignen sich für Cross Plattformen?

Es gibt ja neben Flutter unzählige frameworks um eine App für diverse Plattformen zu bauen. Aber desto mehr ich darüber lese, desto unsicherer werde ich da es unzählige Möglichkeiten gibt.

Folgendes ist geplant:

Eine einfache Notizen App
Muss sowohl im web als auch über Mobile Endgeräte laufen
Greift die gleiche Database ab und Sync. untereinander

Meine konkrete Frage: Welches framework ist aktuell das beste (bietet die besten Möglichkeiten) ?

...zur Frage

Grundlagen der Spieleentwicklung?

Hallo,

ich muss bald eine Präsentation über die Spielentwicklung vortragen und ein Gliederungspunkt sind die Grundlagen davon.

Nun bin ich auf der Suche nach guten Quellen, wo ich etwas über die Grundlagen rausfinden kann, um etwa 3 Minuten darüber sprechen zu können.

Kennt ihr vielleicht etwas, was ich zu den Grundlagen sagen sollte? Im Moment habe ich nur die verschiedenen Entwicklerrollen und Tools da stehen, wie Unity oder Unreal

...zur Frage

Flutter Struktur?

Hallo, ich habe eine Frage!

Und zwar bin ich noch absoluter ANfänger was Flutter betrifft. Ich möchte eine App entwickeln. Diese soll ein Sidebar und ein BottomNavigation Menü haben. EIn Item der BottomNavigationBar soll gleichzeitig die Startseite sein, wenn die App geöffnet wird. Wie mache ich das?

Was muss ich in main.dart reinschreiben?

Kann mir jemand die Struktur erklären ?

...zur Frage

App Development - wie über Cloud zusammenarbeiten?

Hallo zusammen,

da ich noch sehr neu im Bereich Programmieren bin und an einem Schulprojekt mitwirken werde, bei dem eine App in Flutter (in Android Studio) programmiert wird, hat sich die Frage gestellt, wie mehrere Personen gleichzeitig an einem Projekt programmieren können (ohne das umständlich Dateien ausgetauscht werden müssen)

Gibt es bestimmte Dienste/Clouds, die sowas anbieten?

Hat irgendwer schon Erfahrung in dem Bereich Projektmanagement bei der Entwicklung von Apps und wie eine produktive Zusammenarbeit möglich ist?

Danke schon mal im Voraus!

...zur Frage

HTML Formular Input in SQLite Datenbank speichern, (mit NodeJS) wie?

Hallo. Ich möchte den Input eines HTML-Formulars mit Hilfe von Node in eine SQLite Datenbank einfügen.

Mein index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hello world!</title>
    <script src="sqlite.js"></script>
</head>
<body>

    <form action="/team_name_url/" method="post">
        <label for="team_name">Enter name: </label>
        <input id="team_name" type="text" name="name_field" value="Default name for team.">
        <input type="submit" value="OK">
    </form>

</body>
</html>

Mein sqlite.js:

const sqlite3 = require('sqlite3');
const db = new sqlite3.Database('./sqlite.db');

let express = require('express');
let app = express();
const bodyParser= require('body-parser');


app.use(bodyParser.urlencoded({extended:true}));

app.post('/',(req,res)=>{
let placeName = req.body.PlaceName; 
});


db.run(`INSERT INTO places (id, name, coords) VALUES(4, ${placeName}, '1234, 5678');`, function(err) {
    if (err) {
        return console.log(err.message);
    }

    console.log(`A row has been inserted with rowid ${this.lastID}`);


});

db.close();

...zur Frage

Navigationsleiste auf andere html?

Hallo, ich bin ziemlich neu was Websides programmieren angeht und ich finde kein gutes tutorial dazu, wie man wenn man eine Navigationsleiste hat z.b auf Getränke klickt und dann eine andere html/css Seite mit Getränken auftaucht etc.

versuche da auxh bisschen JavaScript mit rein zubringen d.h Benutze die Navigationsleiste von Material Design Lite.

Bin da bisschen überfragt und habe keine ahnung😅

<!-- Always shows a header, even in smaller screens. -->
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
  <header class="mdl-layout__header">
    <div class="mdl-layout__header-row">
      <!-- Title -->
      <span class="mdl-layout-title">Title</span>
      <!-- Add spacer, to align navigation to the right -->
      <div class="mdl-layout-spacer"></div>
      <!-- Navigation. We hide it in small screens. -->
      <nav class="mdl-navigation mdl-layout--large-screen-only">
        <a class="mdl-navigation__link" href="">Link</a>
        <a class="mdl-navigation__link" href="">Link</a>
        <a class="mdl-navigation__link" href="">Link</a>
        <a class="mdl-navigation__link" href="">Link</a>
      </nav>
    </div>
  </header>
  <div class="mdl-layout__drawer">
    <span class="mdl-layout-title">Title</span>
    <nav class="mdl-navigation">
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
      <a class="mdl-navigation__link" href="">Link</a>
    </nav>
  </div>
  <main class="mdl-layout__content">
    <div class="page-content"><!-- Your content goes here --></div>
  </main>
</div>

...zur Frage

Wie kann ich einstellen, dass die div-Boxen auf dem Handy untereinander dargestellt werden?

Guten Tag.

Mein Problem ist Folgendes: Auf dem PC werden die Boxen ganz normal und wie gewollt dargestellt, doch auf dem Handy wird alles in die Reihe gequetscht und man kann nichts erkennen. Wie kann ich nun einstellen, dass die div-Boxen untereinander dargestellt werden?

Quellcode:

<?php
  require('templates/header.php');
?>

<div class="content">
  <div class="row">
    <div class="col-md-12">
      <div class="card">
        <div class="card-header">
          <h3 class="card-title">Kampagnen</h3>
        </div>
        <br><br>
        <div class="row">
          <div class="col-xs-12">
            <div class="box box-container">
              <div class="row">
                <div class="col-xs-12">
                  <div class="box-first box-container">
                    <div class="row">
                      <div class="col-xs-1">
                        <div class="row">
                          <div class="col-xs">
                            <div class="box-nested" text-align="center">
                              <img src="templates/XXX.png"/>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="col-xs-3">
                        <div class="box-nested">
                          <strong> XXX </strong>
                        </div>
                      </div>
                      <div class="col-xs-3">
                        <div class="box-nested">
                          <h4>
                            <span class="badge badge-pill badge-success">XXX: 1,10€</span>
                            <span class="badge badge-pill badge-secondary">XXX: 1,00€</span>
                          </h4>
                        </div>
                      </div>
                      <div class="col-xs-4">
                        <div class="box-nested">
                          <span>
                            <h4>
                              <font color="#400040">
                                <input name="text" id="myInput" id="text" width="100%;" ?>">
                                <button class="badge badge-pill badge-danger" onclick="myFunction()">Link Kopieren</button>
                              </h4>
                            </font>
                            <script>

                              function myFunction() {
                                var copyText = document.getElementById("myInput");
                                copyText.select();
                                document.execCommand("copy");
                              }
                            </script>
                          </span>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="card-body all-icons">
          <div class="row">
            <div class="wrap-table100">
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<?php
  require('templates/footer.php');
?>

Das CSS, welches zugegebener Weise sehr unübersichtlich ist^^, lautet wie folgt:

https://pastebin.com/hHsGJhFE

...zur Frage

Flutter-Future<List> als List zurück geben?

Heeeeey Leute,

Ich rufe eine Liste aus der Datenbank ab und will daraus eine Liste auf der App visualisieren.

Aber in einer async Funktion kann ich keine liste zurück geben.
Wie bekomme ich die Liste jetzt in meinen build.

Code sieht so aus

  void missionEntries()async{
    final Future<List>mission=DBManagement().getAll();
    List missions=await mission.then((value) => null);
  }

  @override
  Widget build(BuildContext context) {
    missionEntries();
    return Expanded(
      child: Container(
        child: ListView.builder(
          itemCount: missions.length,
          itemBuilder: (context, index) {
            return GestureDetector(
              onLongPress: ()=>print("Eintrag bearbeiten!"),
              onTap: ()=>print("Eintrag einsehen!"),
              child: Card(
                child: Row(
                  children: <Widget>[
                    Expanded(
                      child: Text(
                        missions[index]["num"],
                        textAlign: TextAlign.center,
                      ),
                    ),
                    Expanded(
                      child: Text(missions[index]["location"]),
                    ),
                    Expanded(
                      child: Text(missions[index]["date"].toString()),
                    ),
                    Expanded(
                      child: Text(missions[index]["time"].toString()),
                    ),
                    Expanded(
                      child: IconButton(
                        icon: Icon(Icons.delete),
                        onPressed: ()=>print("löschen")
                      )
                    ),
                  ],
                ),
              ),
            );
          }
        ),
      ),
    );
  }

und missionEntries(); müsste eigentlich zu

List missions=missionEntries() werden weil ich die missions liste

ein paar zeilen weiter im ListView.builder brauche.

Hoffe Ihr könnt mir helfen.

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen