title: I can't send real time continuous data to mqtt
body: <pre><code>import 'package:flutter/material.dart';
  import 'package:fluttercanvass/mqtt.dart';
  import 'dart:math';
  
  import 'package:mqtt_client/mqtt_client.dart';
  
  void main() {
    runApp(const MyApp());
  }
  
  class MyApp extends StatelessWidget {
    const MyApp({Key? key}) : super(key: key);
  
    // This widget is the root of your application.
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        home: MyHomePage(),
      );
    }
  }
  
  class MyHomePage extends StatefulWidget {
    @override
    State&lt;MyHomePage&gt; createState() =&gt; _MyHomePageState();
  }
  
  class _MyHomePageState extends State&lt;MyHomePage&gt; {
    List&lt;Offset&gt; points = &lt;Offset&gt;[];
    var left, top;
  
    @override
    void initState() {
      setState(() {
        mqttconnect().connect(left);
      });
      super.initState();
    }
  
    Widget build(BuildContext context) {
      final Container sketchArea = Container(
        decoration: const BoxDecoration(
            image: DecorationImage(
                image: AssetImage('assets/mappingtek.png'), fit: BoxFit.cover)),
        margin: const EdgeInsets.all(1.0),
        alignment: Alignment.topLeft,
        child: CustomPaint(
          painter: Sketcher(points),
        ),
      );
      return Scaffold(
        appBar: AppBar(
          title: Text(left.toString() + ',' + top.toString()),
          actions: [
            Padding(
              // ignore: prefer_const_constructors
              padding: EdgeInsetsDirectional.fromSTEB(0, 0, 30, 0),
              child: IconButton(
                icon: const Icon(
                  Icons.connect_without_contact_outlined,
                  color: Colors.black,
                  size: 45,
                ),
                onPressed: () {},
              ),
            )
          ],
          centerTitle: true,
          elevation: 4,
        ),
        body: Stack(
          children: [
            GestureDetector(
              onPanUpdate: (DragUpdateDetails details) {
                setState(() {
                  RenderBox box = context.findRenderObject() as RenderBox;
                  Offset point = box.globalToLocal(details.globalPosition);
                  left = point.dx;
                  top = point.dy;
                  point = point.translate(0.0, -(AppBar().preferredSize.height));
                  points = List.from(points)..add(point);
                });
              },
              onPanEnd: (DragEndDetails details) {
                points.add(Offset.zero);
              },
              child: sketchArea,
            ),
            Padding(
              padding: const EdgeInsetsDirectional.fromSTEB(1200, 650, 0, 0),
              child: FloatingActionButton(
                tooltip: 'clear Screen',
                backgroundColor: Colors.red,
                child: const Icon(
                  Icons.refresh,
                ),
                onPressed: () {
                  setState(() {
                    points.clear();
                  });
                },
              ),
            ),
          ],
        ),
      );
    }
  }
  
  class Sketcher extends CustomPainter {
    final List&lt;Offset&gt; points;
  
    Sketcher(this.points);
  
    @override
    bool shouldRepaint(Sketcher oldDelegate) {
      return oldDelegate.points != points;
    }
  
    @override
    void paint(Canvas canvas, Size size) {
      Paint paint = Paint()
        ..color = Colors.black
        ..strokeCap = StrokeCap.round
        ..strokeWidth = 4.0;
  
      for (int i = 0; i &lt; points.length - 1; i++) {
        if (points[i] != Offset.zero &amp;&amp; points[i + 1] != Offset.zero) {
          canvas.drawLine(points[i], points[i + 1], paint);
        }
      }
    }
  }
  
   
  </code></pre>
  <p>Above is my master class. In this class, I get the real-time coordinates of the shape I draw with paint. And I want to send it to MQTT in real time. But I don't want.</p>
  <pre><code>import 'package:mqtt_client/mqtt_client.dart';
  import 'package:mqtt_client/mqtt_server_client.dart';
  
  // ignore: camel_case_types
  class mqttconnect {
    MqttServerClient? client =
        MqttServerClient.withPort('192.168.1.147', 'clientId-4ErbOoPajY', 1883);
    connect(left) async {
      client?.logging(on: false);
      client?.onConnected = onConnected;
      client?.onDisconnected = onDisconnected;
  
      try {
        await client?.connect();
      } catch (e) {
        print('Exception: $e');
        //client!.disconnect();
      }
      const pubTopic = 'kare';
      final builder = MqttClientPayloadBuilder();
      builder.addString(left.toString());
      client?.publishMessage(pubTopic, MqttQos.atLeastOnce, builder.payload!);
    }
  
    // connection succeeded
    void onConnected() {
      print('Connected');
    }
  
  // unconnected
    void onDisconnected() {
      print('Disconnected');
    }
  }
   
  </code></pre>
  <p>This is my MQTT server connection class. I cannot send the values that I set continuously from the main class to the MQTT server. When I make a connection, it sends data only once. I want to send real time continuous data. How can I do that?</p>