TOR NOBYE: Hi, my name is Tor Nobye, and I work on the Tools
Android team.
Today I want to show you the brand new IDE
that we have for Android.
As you can see here, it looks sort of dark.
That's a optional dark theme that a lot of us like a lot.
And on the left here, you can see the Project Explorer,
which shows you the files in your project.
And then we have the Code Editor in the center.
And the Code Editor is really the star of this IDE.
It is a very, very intelligent editor that can do really,
really fast refactoring, code completion, and so forth.
And I want to show a few of those Editor features in
detail today.
All right, so here we're looking at some pretty typical
Android code.
But notice that we have some hard coded strings here, or
what appear to be hard coded strings.
Turns out they're actually not.
This IDE can present these strings as if they had been
hard coded.
So you can see here-- as I hover, I can
see the real code.
I can click on it and I can go in and actually look at the
real string.
But the IDE gives me a much simpler view of the code,
which makes it a lot easier to read.
And we don't just do that for strings-- if you look further
down here, you can see we are manipulating some icons, and
over in the gutter on the left you can see
the real icon itself.
And we also help you with completion here.
So if I invoke code completion or just do show doc with F1,
you can see we get this completion dialogue which
shows me all the assets as well.
And that works not just for icons, but
for strings as well.
So if I, for example, click on this one,
you can see we have--
actually we only have two translations for that string.
And furthermore, this also works on colors.
So if I jump to, for example, the color file, you can see
that we see all the colors previewed in the gutter.
Let's take a look at the code again.
One of the really nice things about this new IDE is that it
does really deep code analysis.
So if I, for example, scroll to the bottom here, you can
see that it has highlighted this line and it's saying that
this is a potential null pointer exception.
The reason it knows that is that we have added adaptations
into the Android platform.
So we know which methods can return null, which methods
can't, and in fact we also know-- for example, which
constants are allowed for which APIs.
So it is flagging this [? cull ?] right up here to
set layout direction right.
Which looks good, but you can see it's telling me that the
concept that we were expected to pass in here is one of
these named constants.
And so we use this data not just for code analysis, but
for code completion as well.
So for example, context getSystemService, you now-- if
I invoke code completion, you can see it's offering all the
valid strings, which is something we
couldn't do in the past.
You can invoke actions using the Show Action dialogue.
So I'm going to type Inspect Code, and you can see Inspect
Code lets me run on the whole project or individual files,
and this is how you basically run code inspections.
And we've integrated Lint, so you get all the Lint errors,
but you also get a lot of code analysis that IntelliJ already
comes with.
And it's really great at finding a lot of
bugs in your code.
Let's talk about layout.
So if I jump into a layout file, like this one, you can
see that we now offer you a preview on the
right of the layout.
And this preview stays in sync with my edits.
So if I, for example, click on this text right here--
and I change the text.
Let's see, what should we change it to?
How about to reset?
You can see the preview updates on the left.
And the key thing about this preview is, you get to work
with the code, but it keeps the rendering on
the right in sync.
And you can also click in the editor or in the preview.
And it syncs the selection between the two.
Let's go ahead and create a new layout.
So I'm going to create a new blank layout.
So when I'm typing new layout tags, you can see that it
actually helps me complete my layout on the right.
So the error panel is saying, hey, you have this widget but
you're missing [? a size, ?]
so we can just click on the link to make it do that.
If I make a typo, it detects that and offers to fix it.
And this is basically done for a lot of typical errors that
you might have as you're editing your layouts.
Another feature we have is multi-configuration editing.
So if I jump back to my stopwatch layout here, I can
turn on the ability to see this layout across a number of
different layouts.
When I do that, you can see we actually get a preview here of
what the current layout that I'm editing looks like.
Here we have it on a tablet, a large tablet.
We have it all the way from a 3.7 inch phone up to a 4.7
inch Galaxy Nexus.
It's showing a Nexus 4 on the top left, and we have a seven
inch tablet and a 10 inch tablet.
So this makes it easy, as I'm editing, to see if I'm making
any mistakes.
And this isn't just for screen sizes.
We have many other aspects.
So I can, for example, switch to translations here.
I can see this layout across a number of different languages
and so forth.
And again, as I'm editing, it will generate previews of what
the edits look like.
So I can make sure that I, for example, don't cause the text
to crop on these different languages.
So that's layout preview.
We have this not just for XML editing.
You obviously-- if you prefer, you can do layout editing with
a full UI builder as well.
This is something we're still working on.
But as you can see here we have our UI builder, with
Property Sheet, Palette, and so forth.
And Layout Preview should work here as well.
And I can go ahead and make my edits and as you can see the
previews will update.
And the reason that this one didn't is because this is
using a different layout.
So we have a custom landscape layout here.
That's used when you have a large tablet.
So just one of the ways you can make sure your app looks
good across all the way from phones up to tablets, is to
use dedicated layouts.
And creating new layout in this IDE is very easy.
We basically have this Create Other item in the layout
editor, which takes the current layout, creates a copy
of it, and then you can customize that for the
specific form factor you have in mind.
So there are a lot of new features to
investigate in this IDE.
This is just a preview build, but please give it a try and
let us know what you think.
Thanks for your time.