meta data for this page
  •  

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
ixc2024:tech:tools:green-tools [2024/05/27 13:26] – arshixc2024:tech:tools:green-tools [2024/05/28 12:42] (current) – arsh
Line 94: Line 94:
 **Launching Dev Tools** **Launching Dev Tools**
  
- DevTools can be launched from the command line or integrated within your IDE (such as Visual Studio Code or Android Studio).+ DevTools can be launched from the command line or integrated within your IDE (such as Visual Studio Code or Android Studio). Here are detailed instructions on how you can launch the tool 
 + 
 +**Prerequisites** 
 + 
 +**Flutter SDK:** Ensure you have Flutter installed. You can check by running flutter --version in your terminal. 
 +**IDE:** Use either Visual Studio Code or Android Studio with Flutter and Dart plugins installed. 
 +**Device or Emulator:** Have a device connected or an emulator running. 
 + 
 +Launching Flutter DevTools 
 +**Using Visual Studio Code (VS Code)** 
 + 
 +1-**Install Flutter and Dart Plugins: 
 +** 
 +  * Unordered List ItemGo to the Extensions view (Ctrl+Shift+X). 
 +  * Unordered List ItemSearch for Flutter and Dart and install both plugins. 
 + 
 +2-**Open your Flutter project:** 
 + 
 +  * Unordered List ItemOpen your Flutter project in VS Code. 
 + 
 +3-**Start Debugging:** 
 + 
 +  * Unordered List ItemPress F5 or go to the Debug view (Ctrl+Shift+D) and click on "Run". 
 + 
 +4-**Open DevTools:** 
 + 
 +  * Unordered List ItemOnce the app is running, you will see a notification in the bottom right corner saying "Dart DevTools is available". 
 +  * Unordered List ItemClick on "Open DevTools". 
 + 
 +Alternatively, you can open DevTools from the command palette: 
 + 
 +  * Unordered List ItemPress Ctrl+Shift+P to open the command palette. 
 +  * Unordered List ItemType Open DevTools and select the corresponding option. 
 + 
 +**Using Android Studio** 
 + 
 +1-**Install Flutter and Dart Plugins:** 
 + 
 +  * Unordered List ItemGo to File > Settings (or Preferences on macOS) > Plugins. 
 +  * Unordered List ItemSearch for Flutter and Dart plugins and install them. 
 + 
 +2-**Open your Flutter project:** 
 + 
 +  * Unordered List ItemOpen your Flutter project in Android Studio. 
 + 
 +3-**Start Debugging:** 
 + 
 +  * Unordered List ItemClick on the green play button in the toolbar or select Run > Run 'main.dart'. 
 + 
 +4-**Open DevTools:** 
 + 
 +  * Unordered List ItemOnce the app is running, you will see an icon in the toolbar labeled Flutter Inspector. Click on it. 
 +  * Unordered List ItemIn the Flutter Inspector tab, click on the Open DevTools button. 
 + 
 +**Using Terminal** 
 + 
 +1-**Run your Flutter app:** 
 + 
 +  * Unordered List ItemNavigate to your Flutter project directory in the terminal. 
 +  * Unordered List ItemRun flutter run to start your app. 
 + 
 +2-**Open DevTools:** 
 + 
 +  * Unordered List ItemIn a separate terminal window, run flutter pub global activate devtools to ensure DevTools is installed. 
 +  * Unordered List ItemThen run flutter pub global run devtools to start the DevTools server. 
 +  * Unordered List ItemOpen a web browser and navigate to the URL provided in the terminal (usually http://127.0.0.1:9100). 
 + 
 + 
 +**Video to understand dev tool and how to interpret results** :https://youtu.be/_EYk-E29edo?si=jxWA08iRKVHWwvhi 
  
 **Measurements** **Measurements**