What's new in Android Development Tools
Hi, thanks for tuning in to: What's New in Android Development Tools.
At home edition.
I'm Jamal, a product manageron the Android Studio team.
And also joining me today is Tor.
Together, we'll walk you througha few updates on Android Development Tools.
First up, I'll cover a quick updateon the product roadmap, and then, Tor will give us a demoof some of the latest features in action.
And lastly, I'll wrap upwith some additional feature updates.
Okay, let's take a look at the roadmap.
At Google I/O last year, we chatted with you aboutour deep investment into product quality in an initiative we called Project Marble.
I'm excited to say, we still spend a significant amountof our development time tracking and improvingkey quality metrics such as memory usage, freezes, and typing latency.
Each week, we compare the qualityof each build using quality dashboards and then further diagnose problemsbased on the data.
In addition to quality metrics, we've also rampedour bug triaging process.
In the past, we've not been as diligentin triaging all of the incoming issues as quickly as we should have.
To this end, we have a team-wide effortin re-triaging over 1, 500 old bugs and now have a better filtering process for new bugs.
Alright, since Google I/Owe released Android Studio 3.
6 during the Android Dev Summit event.
This release included supportfor view binding, integrated Google Maps UIinside of the Android Emulator, a new Leak Detection tool, and an update to the user experience to Design Tools.
And then today, the Beta Launch Show for Android 11, we are excited that we just launchedAndroid Studio 4.
0 into the stable release channel, just a couple of days ago.
Which features a new Motion Editorfor creating animations, a Live Layout Inspectorto aid in debugging your app UI, a Build Analyzer which suggests pro tipsto improve build speed, and includes a big updateto the CPU Profiler.
We'll show a few of these in action today.
Additionally, we are excited to show youwhat we just made available in Android Studio 4.
1in the beta release channel today and what we released in the early preview of Android Studio 4.
2 in the Canary channel.
With all of these featuresthat you will see today, I would like to emphasizethat we're striking a balance of quality investmentwith creating a rich set of features to boost your productivity.
We know that you rely on Android Studio day in and day outto make high quality apps.
And we want to strive to continueto make Android Studio the best IDE for app development.
So to those who send us feedback and opt in to sharequality metrics with us, thanks.
It helps us make the right product changesthat matter to you the most.
Okay, before jumping into the demo, I want to highlight, we also made an update to our brand.
The brand update is a visual cue that Android Studio is a part ofthe opinionated suite of tools and APIs that make up modern inter-development.
So don't be surprised if your iconsget this visual refresh.
Alright, on to demos.
I'd like to introduce Torto showcase some of the latest features in Android Studio.
(Tor) Hi everyone, let's take a lookat what we've been working on recently.
So let's start by looking at Systrace, this is a profiler which lets you analyzeyour app at the system level.
For example, to figure out why your UI is lagging.
So here I actually had two swipes:I swiped here and I swiped here and the UI was stuttering in between.
So I can swipe out of selection hereto see a bit more about what's going on.
So you can see here that we're actuallydisplaying the VSYNC process.
That's when the systemis basically refreshing the display.
And we're showing you the frame activityand there was nothing happening here.
We're actually highlighting that in redto show you that you're dropping frames so your UI is no longer updating smoothly.
So if we want we can actuallytake a look at what the CPUs are doing, but right nowI'm interested in the threads, so we can see the render thread and below thatis our application main thread.
And I'm going to swipe out of selection for the time periodwhen the UI was lagging.
When I've done that, I can press Mto zoom in on just that area.
And now you can startto see the individual TraceEvent names and when I click on, for example, this long inflate event you can learn more detailsover in the summary panel on the right.
We list all of the eventsof that name sorted by duration and you can also view the Top Down, Bottom Up, or Flame Chart listing of the stack trace for the event.
The system automaticallytraces a lot for us without any work but we can also go inand add these trace tags ourselves.
So here you can see that I've addedan additional trace section in my fragment where the freeze is happening.
After recording another system trace, I can drill in and confirm that that particular code sectionis the code that is running when we're dropping frames.
And now, if we lookat the same region again, we can confirm thatthat particular code section is the code that is runningwhen we're dropping frames.
And from there, we can continue the analysis with the other profilers.
And, speaking of other profilers, I want to quickly also show you that in Studio 4.
1, we've revampedour memory profiler.
So the UI should be clearerand easier to work with now and we've added supportfor native memory profiling as well.
Alright, so let's close the profilers and next, let's take a lookat our support for Jetpack Compose.
Here's a composable, which is the compose equivalent of a view or a widget.
This one is for a calculator button.
When you make composables, you'll often also create previewsfor your widget where you show your widgetwith some sample data.
For example, we have different colorsfor different types of calculator buttons so we can create another composable which populates our widgetwith sample data and if we annotated with @Preview, then it shows up as a previewon the right.
This makes it easierto visually tweak your composables.
Not only is it faster than running, but you can show multiple previews to test your composablesunder different conditions.
So now we can take our calculator button and compose them into a digit pad, and here we have a preview for that.
And then we can create another composablefor the calculator's LCD screen.
And finally, we can assemble thisinto a calculator.
As you can see, we put the LCD paneland digit pad into a column and turned thatinto a calculator composable.
Right now, we're seeing a single previewfor this calculator, but note that I can also repeatthe preview annotation multiple times and override various aspectsof the appearance such as wide display or large font.
In here I can then see those previews.
And if I want to override somethinglike the theme, I can just add another preview composable.
So, here I'm showing youa preview of the calculator under a different themethan the default one.
This is material theme.
Let's jump intoa different part of the app and here we're buildinga shopping cart for a store.
Let's say I'm trying to usethis shopping cart item composable and I'm a little unsurehow to configure it.
Look what happens if I pull up the docksfor this widget by CTRL+J.
Not only do I get documentation, but a whole example of how to use it and a rendering of what that looks like.
So let me show you how easythat was to hook up.
If you go into that composable, you can see that all we had to do was use Kotlin's KDoc tag at sampleand then point to the preview composable.
That composable is yet another previewlike you've already seen, and the code hereand the preview end results are both combinedto create the docs automatically.
Sometimes code snippetsin documentation are not correct because they're not kept up to date, but that won't be the case heresince your sample code is compiled at the same timeas your app is and if you change your APIs you got to updateyour sample code to match.
Another useful purpose for the previewis to quickly navigate to the right code.
If I want to look at the codefor this plus button, I can just click on the button herein the preview and once I do that, the editor selects the corresponding composablein the same file.
As you can see, it's just selecteda shopping cart item row but if I double click, I can dive all of the wayinto the compose hierarchy and now we can see the the composed codewhich handles the graphics for the individual button.
So single clicks selectsthe closest composable in the same file and double click jumps to the exactcomposable that you clicked on.
For previews, you can make a lot of copiesof your preview set up to show the data in a number of ways, but that can be pretty repetitive.
So, we're also adding supportfor data sources where you can feed sample datainto the preview.
So take a look at this example.
Here, our preview takes a parameter, in this case, a color, and we marked it with a special annotation which points to this sample data provider, who will simply return a bunch of strings.
If you look at the previews, you can see that that's all we had to do.
It iterates through all the dataand adds a preview for each item and we're going to providea bunch of built-in sample data to make this simple.
So for example, this is a sample text generator in the compose tooling librarywhich returns lorem ipsum sample text.
Let's jump backto our calculator for a second.
In some cases, you can even make your preview functional, not just visual.
Notice that little finger iconabove our preview? If I click on it, that will turn on live preview mode.
Now we try run parts of your appon the fly within the IDE.
Let's see what happenswith our calculator.
So if I run some basic arithmeticlike 3 times 8, it computes 24, which means that we've correctly hooked upour calculator compose code.
And when I'm done, I'll press stop.
So the preview is greatfor looking at your widgets under a number of scenariosand to even tweak some of the behavior, but of course, you'll want to really runyour application as well.
So, let's do that, I'm going to hit run.
So this will run our app on the emulator.
As you can see, now in Studio 4.
1, we have the emulator embeddedwithin the IDE.
That makes it really easy to work with.
I don't have to juggleapplication windows to find it, and I can assign a keyboard shortcutto hide and show it.
So now it's installing the app.
Notice, by the way, how quicklythe emulator booted.
That's becauseI'm using emulator snapshots and we made this much easierto access now.
So once I have the emulatorin the state that I like it, I click on the save snapshot button here, I can name it, and notice how I can also designatethis as a snapshot that I'll boot from next timeI restart this virtual device.
We've also added some basic options herefor changing your boot options later and I'll just go backto the one I configured before.
A couple more tips for the emulator, first, when you resize this window, we scale the emulator to fill it, but if you want to zoom in further, we have zooming controls right here on the surface, and if you don't need this, or if it blocks your emulator, note that there's actuallyan option panel up here where you can hide the zoom controls.
And you can also go aheadand crop the device frames if you want to get as much screenreal estate as possible.
But I happened to likethe way the device frames look, and I have a large monitor, so I'll put that back.
Alright, so our app is up and runningand we have a simple store app here backed by a database.
And the next feature I want to show youis our new database inspector.
All I have to do is open itfrom the bottom left corner and wait a couple of seconds.
Studio will start talkingto the app process and discover the databases.
So this is an app whichis using the Androidx Room library, so we can seeour room database tables here.
And I can double clickon the shopping cart table to open it up.
As you can see we have one itemin there with quantity two.
Let's take a look at what happenswhen I go over in my app and increase the quantity to three and four.
Nothing happens immediately, but I can now click refresh on the table and now you can seethe correctly updated quantity value.
I don't even need to do this manually, let's turn on live updates and when I've done that, you can see thatwhen I interact with the app, the table respondspretty much immediately.
We can also push datain the other direction.
So let me turn off live updates and now I'm going to go inand edit the color values so I'll change it to “Oh So Orange”and look what happens once I change it.
The product renderingand the shopping cart updates to match.
So we can push databack into the apps as well on the fly.
This is the corresponding source codeso you can see that it's using Room and we have some SQL code hereannotated on some data classes.
I can actually go ahead and run these SQL queriesdirectly from the editor gutter.
So now I basically ran the queryto empty out the shopping cart and so it emptied out.
I can also run any SQL query that I want.
So I can go and type inor copy/paste in my SQL query and when I run the statement you can see that it inserts the databack into the database.
If I run it again, we get the expected error because the ID is not unique, but if I create a unique ID, I can add multiple itemsinto the database here.
So that's the Database Inspectorwhich is available in Studio 4.
1.
Another feature we've added recently is improved supportfor machine learning model binding with TensorFlow Lite.
So here's an appwhich performs object recognition, we made it really simpleto wire up TensorFlow models.
First, you getyour TensorFlow Lite model file for example, from tensorflow.
org, and then in Studio, you go and open upNew > Other > TensorFlow Lite Model.
In this panel, you point to your downloaded file.
Now, I've already done that in my projectwith a downloaded object detection model.
What Studio does is turn on model bindingin your build.
gradle file.
You can see that here.
Note, by the way, that this isa new thing we've added in 4.
0, we now have a buildFeatures block where you can turnvarious features on or off if you don't need them.
So, for example, if you don't use buildConfig fields, you can turn that off.
There's no need to generatebuildConfig class when you're building.
The second important thingthat import wizard does is create a new source set called ml.
And it places a copyof your imported TensorFlow Lite file in that source set.
So if I click on this file to open even though it's binary data, we have a special editor which shows the known metadataabout this model.
And it also shows you the codethat you should write to process the model.
So this is a running appover in the emulator.
We're using CameraX and TensorFlowto run live detection of objects in the camera viewfinder.
And while the emulatorhas a scene it presents to the camera, it's hard to get a feelfor how that detection works.
I want to aim my camera around in my room.
So for that, we'll deploy to a real device.
And a new feature we've addedis Wi-Fi pairing.
This is a new feature in Android 11and we're still working on support for it in Android Studios, so this is a bit of a sneak peek.
In our device user where I normally selectmy emulator virtual devices, there's a “pair with Wi-Fi” option.
So I invoke that and there area couple of options here and one of them is to pair with a QR code.
So now I'll show youwhat I do on my phone.
I open up developer options, I turn on Wi-Fi debugging, and there's an option to pair by QR code.
So then I just aim the phone at Studioand after a few seconds, it should pair and establish a connection.
And then now I can use it as a devicewithout a wire.
So I'm going to hit just run.
And here's the app, it deploys quickly over Wi-Fi.
Though, if you have a good USB 3 cable, that's still going to be faster.
But this is pretty convenient especially because it doesn'ttake up any ports on my computer and I've used all of my portsto plug in some older phones to run tests on.
And that's another featureI want to show you now: parallel device testing.
So here's an appwhich has some instrumentation tests.
Once again, we go to the device menu, but this time, we're going to choose modify device set, so here I'm offered all of the devices that Studio knows about, my connected devices, and available emulator virtual devices.
What happens next? Is that once the binary is built, we push it to allof the devices in parallel.
And as soon as the app is installedon a given device, the tests start running there.
And now you can see the resultsstart to stream in.
We display these results in a matrix such as it's easy to see what's going onand to drill into any failures.
So here we have a testwhich is failing on some but not all devices.
So I can click and examinethe test results for each failure.
Okay, let's cut that short and take a lookat the visual design tools.
So here I'm runninglast year's Google I/O app and I'll open up the layout inspector.
So just like with the database inspector, it'll automatically connect to the app and pull down the view hierarchyafter a few seconds.
So here you can seethe whole view hierarchy and this is updated live, like the database inspector as I use the app in the emulator.
I can also turn on the 3D viewon my view hierarchy and drag the display aroundto get a sense of how the views all come together.
And this also helps medebug overdraw.
So here I can see that I have some views that are completely hiddenby views on top, such as this green one, and that's unnecessaryand we should get rid of it.
Next, we can click on individual viewsand when I do that, I can see it selected in the outlinewhere it sits in the view hierarchy with parents and children and so on.
And in the rendering, I can see the type of view I've selected.
So, let's say I wonder whythis text is blue instead of black, which I attempted to make it.
For that, we'll usethe property sheet on the right.
By the way, we've recentlyadded the ability to show you the dimensionsin dps instead of pixels, but you can switch back to pixelsif that's what you prefer in the window settings.
So now I'm looking for a colorinstead of scrolling through all these I can just searchand then I quickly see it.
Here's the great part: I can see that the color is blueand I can see my attempt to make the color black.
We're showing herethat there was a better match in the style lookup priority order.
And I can drill into the exactresource resolution chain to see exactly wherethe color is coming from.
So this brings some of the functionalityof the Chrome Dev Tools to the Android View Hierarchy.
Next, let's take a lookat the layout editor.
One of the really nice thingswe have in the layout editor is support for tools attributeswhich lets you override certain attributes while you're in the designer.
So here, for example, in this layout, we're showing the navigation menu.
But that means I can't seethe content area below it.
We've recently addedthis little button, a wrench icon, for temporarily turning offall the tools attributes.
When I do that here, I can see the content pane below it.
That works because we're turning off the tools attribute which switches the drawer on.
The second thing we've added is an ability to hide and show viewsconveniently right from the outline.
Like layers in graphics programs.
That's what the second column is for.
So for example, for this app bar, I can decide to hide it until runtime, either as invisible, where it takes up space, or gone, where it doesn't.
I can also just do thisfor tools attributes.
The third thing I want to show you is our supportfor accessibility validation.
And this feature is still in development.
So here's a layout where I've madea number of mistakes on purpose for accessibility.
In the past, we've flagged some warningswe could tell by just looking at the XML, for example, failing to seta description on image tags.
But now, we're runningthe Android accessibility scanner on the rendered view hierarchy.
That makes it possible to flag thingsthat we can't determine just by static analysis.
For example, it can flag whetherthere isn't enough contrast between the text and the backgroundthat it's painted on top of.
Here's another app I'm working on.
I'm going to build a photo carousel where I can drag througha number of images.
We've recently added thistransforms panel on the right, which makes it easy to visualizewhat's happening with the transforms.
So for example, the image on the right and the image of the leftare rotated slightly and I can of course goand make crazy edits myself.
By the way, pro tip:if you double click on the slider, you can quickly reset it to zero.
The next thing I'll dois migrate this layout form a constraint layout to a motion layoutin order to animate it.
So I'll just right clickand invoke convert to motion layout, and this also creates a scene filewith two states: start and end.
All I need to do now is to choose an imageand the end state, and change my scene to the way I want them to look.
So I can, for example, go and add some rotation.
And then I can play this transition.
You can see it's now playingthrough the animation by rotating the image.
We've also recently addedthis transition editor so you can tweakthe curves of the interpolators.
There's a lot more functionality here, and just to show what's possible, let me jump to the completed stateof this layout.
So here you can see that we've createda number of different states and we've defined the transitionsbetween them, and I can hit playin the design surface to view them and I can go inand change the constraints, the transformations, and transitions.
And if we run the app in the emulator, we can then verify that the touch handlers are working as expected as well.
So here we've coordinated the exact motionas you drag from one image to the next.
And I didn't have to write touch handlers or complicated codeto coordinate the motion.
I can keep tweaking thatvisually in the tools.
For example, let's see what happens if I tweak this rotationof the next image.
Let's invoke apply changes.
Notice how fast that change made itto the running app.
We made a number of improvementsto our applied changes feature, they have special support in Android 11, both to have faster application installsduring development, as well as allowing more structuralchanges to your app while running, such as adding methodsand static fields.
But you might still think that that buildlooked faster than you're used to.
And if so, you'd be right.
Because in addition to the improvementsto Android 11 and our deployment pipeline, I've turned ontwo experimental Gradle features: native file watchersand Gradle instant execution.
Let me invoke build again, Command F9.
Notice how it finished immediately.
That's because it, now, doesn't needto look at the file system to know that nothing has changed.
You can see that in the output here, it's monitoring the file systemwith operating system support.
And the second thing is thatit's cached the whole task graph, so it doesn't need to compute anything.
So if I go and changejust one file and hit build, you can see that it gets very quicklyto the point and it compiles the file.
It doesn't run througha huge number of up to date checks.
And Jamal will tell you moreabout this feature after my demo.
Notice how at the end of the build, we put a link to the build analyzer.
That's to help bring awarenessthat we now have a feature to help figure out build bottlenecks.
We've discovered that in many cases the recent buildsare slower than they need to be is because there areslow third party plugins or you have non-incremental annotationprocessors and so on.
So even if we were to makethe Android Gradle plugin twice as fast, that won't meaningfullyspeed up your build if 80% of the timeis spent in a different task.
So every time you build in the IDEwith ADB 4.
0 or later, we collect some low overhead datato be able to analyze the build.
So here's a more interesting projectthat I have built in advance.
In Studio 4.
1, we've reworked the UI significantly based on user feedback and testing.
You can take a look at the taskswhich are on the critical path because there's no pointoptimizing something which is running in parallelwith a slower task.
You're not going to makethe overall build shorter.
You can also break it down by pluginsinstead of by task.
We also provide warningsfor specific problems that we know about, so here we have tasks that'll always runeven when the inputs don't change, that's obviously badfor incremental build times.
Another problem that it's pin pointingis mis-configuring tasks such as this sharing output folder.
Because if you do that, Gradle will not be able to run the tasks incrementally.
And the last problem it's showing us is that when you're usingannotation processors, you'll want to make surethat those are incremental.
A lot of the most commonlyused ones in Android R but only if you've updatedto recent versions.
In short, if you're interestedin making your builds faster, you'll definitelywant to use the build analyzer to analyze your builds.
And now, let's do a quick lightening roundof a few other features to look for.
We've added editor supportfor dependency injection, both for daggerand our new Androidx Hilt library.
And this makes it easy to navigatebetween providers and receivers.
We've also revamped our supportfor editing shrinking files with full error validation.
So here for example, I can see that I've forgotten to update my old rulesafter migrating to Android X.
We also have supportfor core library desugaring.
So when you turn that on, you can for example usejava.
time in your apps on older API levelsthat didn't include it.
If you look at the byte code, you can see that we've rewrittenreferences to java time with referencesto a locally bundle library.
We've also added supportfor Kotlin Gradle script, not just in the editor but across the IDE.
If I for example open upthe product structure dialog then I get suggestionsfor my KTS project, and when I hit apply, when can sync the updated build model back to the build files correctly.
And last but not least, we've rebased Android Studio 4.
1 on top of IntelliJ IDEA 2020.
1, which brings with it a huge numberof new features across the entire IDE as well as qualityand performance improvements.
Well, I think that's going to do itfor my demo, so thank you for your timeand back to you, Jamal.
Well, thanks, Tor.
So that exciting demo hopefully highlightsthe end-to-end range of features that we are invested into make you more productive.
From designing, debugging, to performance profiling.
Before we close, I want to highlighta few additional updates to the Android build system.
In Android Studio 4.
1, you can now tryoutGradle Configuration Caching, a new file watcherand a virtual file system for Gradle.
These features combinedprovide a dramatic boost to your app builds.
Of course, results can varybased on your particular project setup, but benchmarkson the Google Santa tracker app that you can find in GitHub show almost 60% decreasein incremental build time when you use these features together.
Most of the work is doneon the Android Gradle plugin side.
But other build plugins also need updatesbefore we can turn this on by default.
So please try outthis preview feature today and provide feedback.
Lastly for build, we're previewingnew Android Gradle plugin APIs in Android Studio 4.
1.
Unlike previous versions, the new Android Gradle plugin APIs, will have a clear separationbetween public API and internal implementation, plus, we'll haveofficial documentation as well.
The APIs are work in progressbut we will add more over the next several releases.
Secondly, the new APIswill be maintainable for feature upgrades and internal system improvements without breakingyour public integration points.
Finally, it's dynamic and compatiblewith configuration caching by allowing you to move any competitionlike version code, to tasks.
Alright, that was a lot.
But the Android Studio team and I are excited to roll upthis range of new features.
The features that Torand I showed you today can be found in the latest stable versionof Android Studio 4.
0, while many of the Jetpack Compose featurescan be found on the Canary channel with Android Studio 4.
2.
Thanks for joining us todayto hear the latest on Android development tools.
If you want to try outthe features you saw in Android Studio 4.
1 or 4.
2you can download the latest previews of Android Studio the top link show.
In parallel, you can also downloadthe latest stable version of Android Studio as well.
As long as you keep your app projecton a stable Gradle plugin version, you can easily downloadand try out features in both the stable and Canary channelsof Android Studio.
Okay, on behalfof the Android Studio team, thanks again for watching.
And please keep an eye outfor more deep dive content about Android Developer toolsin the upcoming weeks ahead.
Comments
Post a Comment