We know that for many web applications, Internet connection information is very important to us. It is necessary for us to monitor the connection information of the network. Once the network connection is disconnected, we need to alert the user or do something about it. Although there is no official information about it on our official website, we can still get its API through the following methods.
\
We can use the SDK template to create a simple QML application. Because we want to use connectivity, we must join the security policy of “Connectivity”.
\
\
There is also NetworkStatus on our developer website, but it may not be complete. We can use the following command to get more information:
\
$qmlplugindump Ubuntu. Connectivity 1.0Copy the code\
The following information is displayed:
\
Import qtquick. tooling 1.1 // This file describes the plugin-supplied types contained in the library QML tooling purposes only. // // This file was auto-generated by: / / 'qmlplugindump Ubuntu. Connectivity 1.0' Module {Component {name: "connectivityqt: : Connectivity" prototype: "QObject" exports: ["Connectivity 1.0", "NetworkingStatus 1.0"] isCreatable: false isSingleton: true exportMetaObjectRevisions: [0, 0] Enum { name: "Limitations" values: { "Bandwith": 0 } } Enum { name: "Status" values: { "Offline": 0, "Connecting": 1, "Online": 2 } } Property { name: "flightMode"; type: "bool" } Property { name: "FlightMode"; type: "bool" } Property { name: "online"; type: "bool"; isReadonly: true } Property { name: "limitedBandwith"; type: "bool"; isReadonly: true } Property { name: "Limitations"; type: "QVector<Limitations>"; isReadonly: true }
Property { name: "Status"; type: "connectivityqt::Connectivity::Status"; isReadonly: true }
Property { name: "wifiEnabled"; type: "bool" }
Property { name: "WifiEnabled"; type: "bool" }
Property { name: "UnstoppableOperationHappening"; type: "bool"; isReadonly: true }
Property { name: "FlightModeSwitchEnabled"; type: "bool"; isReadonly: true }
Property { name: "flightModeSwitchEnabled"; type: "bool"; isReadonly: true }
Property { name: "WifiSwitchEnabled"; type: "bool"; isReadonly: true }
Property { name: "wifiSwitchEnabled"; type: "bool"; isReadonly: true }
Property { name: "HotspotSwitchEnabled"; type: "bool"; isReadonly: true }
Property { name: "hotspotSwitchEnabled"; type: "bool"; isReadonly: true }
Property { name: "hotspotSsid"; type: "QByteArray" }
Property { name: "hotspotPassword"; type: "string" }
Property { name: "hotspotEnabled"; type: "bool" }
Property { name: "hotspotMode"; type: "string" }
Property { name: "hotspotStored"; type: "bool"; isReadonly: true }
Property { name: "Initialized"; type: "bool"; isReadonly: true }
Signal {
name: "flightModeUpdated"
Parameter { type: "bool" }
}
Signal {
name: "onlineUpdated"
Parameter { name: "value"; type: "bool" }
}
Signal {
name: "limitedBandwithUpdated"
Parameter { name: "value"; type: "bool" }
}
Signal {
name: "limitationsUpdated"
Parameter { type: "QVector<Limitations>" }
}
Signal {
name: "statusUpdated"
Parameter { name: "value"; type: "connectivityqt::Connectivity::Status" }
}
Signal {
name: "wifiEnabledUpdated"
Parameter { type: "bool" }
}
Signal {
name: "unstoppableOperationHappeningUpdated"
Parameter { type: "bool" }
}
Signal {
name: "flightModeSwitchEnabledUpdated"
Parameter { type: "bool" }
}
Signal {
name: "wifiSwitchEnabledUpdated"
Parameter { type: "bool" }
}
Signal {
name: "hotspotSwitchEnabledUpdated"
Parameter { type: "bool" }
}
Signal {
name: "hotspotSsidUpdated"
Parameter { name: "name"; type: "QByteArray" }
}
Signal {
name: "hotspotPasswordUpdated"
Parameter { name: "password"; type: "string" }
}
Signal {
name: "hotspotEnabledUpdated"
Parameter { type: "bool" }
}
Signal {
name: "hotspotModeUpdated"
Parameter { name: "mode"; type: "string" }
}
Signal {
name: "hotspotStoredUpdated"
Parameter { type: "bool" }
}
Signal {
name: "reportError"
Parameter { name: "reason"; type: "int" }
}
Signal { name: "initialized" }
Method {
name: "setFlightMode"
Parameter { name: "enabled"; type: "bool" }
}
Method {
name: "setwifiEnabled"
Parameter { name: "enabled"; type: "bool" }
}
Method {
name: "setHotspotEnabled"
Parameter { name: "active"; type: "bool" }
}
Method {
name: "setHotspotSsid"
Parameter { name: "ssid"; type: "QByteArray" }
}
Method {
name: "setHotspotPassword"
Parameter { name: "password"; type: "string" }
}
Method {
name: "setHotspotMode"
Parameter { name: "mode"; type: "string" }
}
}
}
Copy the code\
\
Here we see a property called “status”. We can monitor the changes of this property to get changes in the network connection state. Our main.qml file looks like this:
\
Import QtQuick 2.0 1.1 import import Ubuntu.Com ponents Ubuntu. Connectivity import Ubuntu.Com ponents. 1.0 0.1 as ListItems ListItem /*! \brief MainView with a Label and Button elements. */ MainView { id: root // objectName for functional testing purposes (autopilot-qt5) objectName: "mainView" // Note! applicationName needs to match the "name" field of the click manifest applicationName: "networkstatus.ubuntu" /* This property enables the application to change orientation when the device is rotated. The default is false. */ //automaticOrientation: true // Removes the old toolbar and enables new features of the new header. useDeprecatedToolbar: false width: units.gu(50) height: units.gu(75) property real margins: units.gu(2) property real buttonWidth: units.gu(9) Connections { target: NetworkingStatus // full status can be retrieved from the base C++ class // status property onStatusUpdated: { if (value === NetworkingStatus.Offline) { console.log("Status: Offline") } if (value === NetworkingStatus.Connecting) { console.log("Status: Connecting") } if (value === NetworkingStatus.Online) { console.log("Status: Online") } online.subText = NetworkingStatus.online ? "yes" : "no"; } onWifiEnabledUpdated: { console.log("wifiEnabledUpdated: " + NetworkingStatus.WifiEnabled); } onFlightModeUpdated: { console.log("FlightModeUpdated: " + NetworkingStatus.flightMode); flightMode.subText = NetworkingStatus.flightMode ? "yes" : "no" } onHotspotEnabledUpdated: { console.log("hotspotEnabledUpdated: " + NetworkingStatus.hotspotEnabled) hotspotEnabled.subText = etworkingStatus.hotspotEnabled ? "yes" : "no" } onUnstoppableOperationHappeningUpdated: { console.log("unstoppableOperationHappeningUpdated: " + NetworkingStatus.UnstoppableOperationHappening); } onWifiSwitchEnabledUpdated: { console.log("wifiSwitchEnabledUpdated: " + NetworkingStatus.wifiSwitchEnabled); } onFlightModeSwitchEnabledUpdated: { console.log("flightModeSwitchEnabledUpdated: " + NetworkingStatus.flightModeSwitchEnabled); } onHotspotSsidUpdated: { console.log("hotspotSsidUpdated: " + NetworkingStatus.hotspotSsid); } onHotspotPasswordUpdated: { console.log("hotspotPasswordUpdated: " + NetworkingStatus.password); hotspotPassword.subText = NetworkingStatus.password; } onHotspotStoredUpdated: { console.log("hotspotStoredUpdated: " + NetworkingStatus.hotspotStored); } onInitialized: { console.log("initialized"); } } function getStatus(status) { console.log("status: " + status); switch(status) { case 0: return "Offline"; case 1: return "Connecting"; case 2: return "Online" } } Page { title: i18n.tr("Networking Status") ListModel { id: mymodel } Flickable { id: scrollWidget anchors.fill: parent contentHeight: contentItem.childrenRect.height boundsBehavior: (contentHeight > root.height) ? Flickable.DragAndOvershootBounds : Flickable.StopAtBounds flickableDirection: Flickable.VerticalFlick Column { id: layout anchors.left: parent.left anchors.right: parent.right spacing: units.gu(1) ListItem.Subtitled { id: online text: i18n.tr("online") subText: NetworkingStatus.online ? "yes" : "no" } ListItem.Subtitled { id: bandwidth text: i18n.tr("Bandwith") subText: NetworkingStatus.limitedBandwith ? "Bandwith limited" : "Bandwith not limited" } ListItem.Subtitled { id: flightMode text: i18n.tr("flight mode") subText: NetworkingStatus.flightMode ? "yes" : "no" } ListItem.Subtitled { id: status text: i18n.tr("Status") subText: getStatus(NetworkingStatus.Status) } ListItem.Subtitled { id: wifiEnabled text: i18n.tr("wifiEnabled") subText: NetworkingStatus.wifiEnabled ? "yes" : "no" } ListItem.Subtitled { id: flightModeSwichEnabled text: i18n.tr("FlightModeSwitchEnabled") subText: NetworkingStatus.FlightModeSwitchEnabled ? "yes" : "no" } ListItem.Subtitled { text: i18n.tr("WifiSwitchEnabled") subText: NetworkingStatus.WifiSwitchEnabled ? "yes" : "no" } ListItem.Subtitled { id: hotspotSwitchEnabled text: i18n.tr("HotspotSwitchEnabled") subText: NetworkingStatus.HotspotSwitchEnabled ? "yes" : "no" } ListItem.Subtitled { id: hotspotEnabled text: i18n.tr("hotspotEnabled") subText: NetworkingStatus.hotspotEnabled ? "yes" : "no" } ListItem.Subtitled { id: hotspotPassword text: i18n.tr("hotspotPassword") subText: NetworkingStatus.hotspotPassword } ListItem.Subtitled { id: hotspotStored text: i18n.tr("hotspotStored") subText: NetworkingStatus.hotspotStored ? "yes" : "no" } ListItem.Subtitled { id: initialized text: i18n.tr("Initialized") subText: NetworkingStatus.Initialized ? "yes" : "no" } } } } }Copy the code\
\
Finally running our app, we can see the state change when wifi is disconnected and connected:
\
\
The test code is at: github.com/liu-xiao-gu…
\
\