Build a Live Weather App| MVD with QML #3
Bring your weather app to life! We connect ComboBox to location data, integrate live weather APIs, and complete a fully functional weather application. Learn textRole/valueRole bindings, TextField search, BusyIndicator feedback, and dynamic background images based on weather conditions.
This video is part 3 of the "Model View Delegate with QML" series, completing our journey from basic models to our final weather application.
🎓 Get the full learning experience by enrolling in the complete learning path at https://www.qt.io/academy/course-cata...
📚 What You'll Learn:
• What is ComboBox and its textRole and valueRole properties
• How ComboBox uses Models and Delegates internally
• Integrating LiveLocationModel for global location search
• TextField input with onAccepted handlers
• LiveWeatherModel for real-time weather data
• Using BusyIndicator for loading feedback
• Switch control for Celsius/Fahrenheit toggle
• Dynamic backgrounds based on weather conditions
• Displaying current weather with model properties
⏰ Timestamps:
00:00 Introduction to ComboBox
00:47 Adding ComboBox to the UI
01:00 ComboBox with ItemDelegate
01:40 Creating a Static Location Model for Testing
01:57 textRole and valueRole Properties
04:25 LiveLocationModel Integration
04:33 TextField for Location Search
05:19 LiveWeatherModel for Weather Data
05:30 Adding Celsius/Fahrenheit Switch
06:13 BusyIndicator Feedback
06:34 Testing the Live Weather App
07:20 Displaying Current Weather
07:57 Dynamic Background Images
08:40 Final Weather Application Demo
📖 Resources:
• Code Repository: https://github.com/qt-learning/Model-...
• ComboBox Documentation: https://doc.qt.io/qt-6/qml-qtquick-co...
• Open-Meteo Weather API: https://open-meteo.com/
• Open-Meteo Geocoding API: https://open-meteo.com/en/docs/geocod...
🔗 Related Videos:
• Previous: Displaying Data with QML | MVD with QML #2: • Displaying Data with QML | MVD with QML #2
• Link to playlist: • Model View Delegate with QML | Qt Academy
📱 Continue Learning:
• Qt Academy: https://qt.io/academy
• Forum: https://forum.qt.io
©️ Licensing Information: For all the source code shown in the video, the licensing information is defined in the relevant project repository. If no license is explicitly stated in the repository or there is no project, and you want to use the code, reach out to the Qt Company. If you are interested in acquiring a commercial license for the codes, please reach out to The Qt Company Oy (https://www.qt.io/pricing). Any trademarks shown in the videos are the exclusive property of its owners and are not licensed in any way.
Qt #Framework #QML #ComboBox #WeatherApp #LiveData #API #Tutorial #CrossPlatform