IOS Swift MQTT won't publish message to Raspberry Pi - ios

Question

l am quite new to iOS development and just having a hard time trying to make MQTT publish messages from my phone. l wish to use the app I have built to control the raspberry pi wheels (the step motors more specifically). I made a button to connect to the robot.
struct ConnectToRobot: View {
var body: some View {
Button {
print("Connect to robot")
mqttClient.connect()
} label: {
Image(systemName: "circle")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
When l press the button from the app in my phone, it connects to the raspberry pi and it shows me the message "subscribing", "subscribed". However, when l press any other buttons on the app, like "forward" or anything else it seems to not work at all. Here is the code from the RPi:
#For checking the connection status
def connectionStatus(client, userdata, flags, rc):
print("subscribing")
mqttClient.subscribe("robot/move")
print("subscribed")
#movement control
def messageDecoder(client, userdata, msg):
message = msg.payload.decode(encoding='UTF-8')
if message == "f":
forward()
mess2 = msg.payload.decode(encoding='UTF-8')
print("^^^ forward! ^^^")
elif message == "b":
backward()
print("\/ backward \/")
elif message == "l":
left()
print("<- left")
elif message == "r":
right()
print("-> right")
elif message == "fl":
diagFL()
print("\ Diagonal Front Left")
elif message == "fr":
diagFR()
print("/ Diag Front Right")
elif message == "bl":
diagBL()
print("/ Diag Back Left")
elif message == "br":
diagBR()
print("\ Diag back Right")
elif message == "cw":
cw()
print("O Clockwise")
elif message == "ccw":
ccw()
print("O Counter Clockwise")
elif message == "s":
stop()
else:
print("?!? Unknown message?!?")
# Set up calling functions to mqttClient
mqttClient.on_connect = connectionStatus
mqttClient.on_message = messageDecoder
# Connect to the MQTT server & loop forever.
# CTRL-C will stop the program from running.
mqttClient.connect(serverAddress)
mqttClient.loop_forever()
This is my swiftUI code below:
import SwiftUI
import CocoaMQTT
let mqttClient = CocoaMQTT(clientID: "Robot", host: "raspberrypi.local", port: 1883)
struct ContentView: View {
var body: some View {
ZStack {
VStack{
HStack {
VStack {
BackwardLeft()
Backward()
BackwardRight()
}
VStack{
Left()
ConnectToRobot()
Right()
}
VStack {
ForwardLeft()
Forward()
ForwardRight()
}
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
//First VStack
//Back left
struct BackwardLeft: View {
var body: some View {
Button {
print("Move back left")
} label: {
Image(systemName: "arrow.up.left.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//Backward
struct Backward: View {
var body: some View {
Button (action: {
mqttClient.publish("robot/move", withString: "b")
print("Move back")
}, label: {
Image(systemName: "arrow.left.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
})
}
}
//Back Right
struct BackwardRight: View {
var body: some View {
Button {
print("Back right")
} label: {
Image(systemName: "arrow.down.left.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//Second VStack
//Left
struct Left: View {
var body: some View {
Button {
mqttClient.allowUntrustCACertificate = true
mqttClient.publish("robot/move", withString: "l")
print("Move left")
} label: {
Image(systemName: "arrow.up.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//MQTT Connection
struct ConnectToRobot: View {
var body: some View {
Button {
print("Connect to robot")
mqttClient.connect()
} label: {
Image(systemName: "circle")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//Right
struct Right: View {
var body: some View {
Button {
print("Move right")
mqttClient.publish("robot/move", withString: "r")
} label: {
Image(systemName: "arrow.down.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//Third VStack
//Forward left
struct ForwardLeft: View {
var body: some View {
Button {
print("Move foward left")
} label: {
Image(systemName: "arrow.up.right.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//Forward
struct Forward: View {
var body: some View {
Button {
mqttClient.publish("robot/move", withString: "f")
print("Move forward")
} label: {
Image(systemName: "arrow.right.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
//Forward right
struct ForwardRight: View {
var body: some View {
Button {
print("Move top right")
} label: {
Image(systemName: "arrow.down.right.square")
.renderingMode(.template)
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 100, height: 100)
.foregroundColor(.white)
}
}
}
I am not sure what is wrong, because when l press connect the message shows up on the PI terminal but when l press a direction button nothing shows up. I am thinking it might be a connection issue or something l did wrong in the IOS code. Thanks in advance
I tried to change the swiftUI code but it didn't work