Для начала запустим Android Studio и создадим пустой проект.
Задаем название приложения, пакет и путь, по которому будет лежать проект:
Указываем минимальную версию Android, поддерживаемую нашим приложением. Google рекомендует использовать версию Android 4.0.3, но для наших целей подойдет и Android версии 2:
Выбираем вкладку Add No Activity и нажимаем Finish:
После создания нового проекта должно появиться следующее окно:
Чтобы увидеть дерево текущего проекта (окно слева) нужно нажать на вкладку Project (слева) или Alt+1.
Создаем 2 класса: MyActivity и MyView. Чтобы добавить класс в наш проект нажимаем правой кнопкой мыши на папке app->java->me.graphica.canvasanimation и выбираем пункт меню New->Java Class.
MyView:
package me.graphica.canvasanimation; import android.content.Context; import android.view.View; public class MyView extends View { public MyView(Context context) { super(context); } }
MyActivity:
package me.graphica.canvasanimation; import android.app.Activity; import android.os.Bundle; public class MyActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { //вызывается каждый раз при загрузке приложения и повороте экрана super.onCreate(savedInstanceState); setContentView(new MyView(this)); //отображаем наш View на весь экран } }
Осталось зарегистрировать MyActivity в манифесте приложения.
app->manifests->AndroidManifest.xml:
<manifest
package="me.graphica.canvasanimation"
xmlns:android="http://schemas.android.com/apk/res/android">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<!-- Регистрируем MyActivity -->
<activity
android:name=".MyActivity"
android:label="@string/app_name"
android:theme="@style/AppTheme">
<intent-filter>
<action android:name="android.intent.action.MAIN"/>
<category android:name="android.intent.category.LAUNCHER"/>
</intent-filter>
</activity>
</application>
</manifest>Приложение готово. Чтобы проверить его на устройстве необходимо подключить смартфон через usb-кабель к компьютеру и нажать Shift+F10:
Приложение должно выглядеть следующим образом:
Чтобы избавиться от верхней полоски, в файл app->res->values->styles.xml необходимо добавить следующий блок кода:
<style name="AppTheme.Fullscreen">
<item name="android:windowFullscreen">true</item>
</style>и сменить тему приложения в манифесте с
android:theme="@style/AppTheme"на
android:theme="@style/AppTheme.Fullscreen"
Но смысла в таком пустом приложении немного. Поэтому наполним его графическими примитивами. Для этого достаточно привести класс MyView к следующему виду:
package me.graphica.canvasanimation; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.view.View; public class MyView extends View { private Paint mPaint; //Paint говорит нам как именно рисовать графические примитивы private Paint mPaint2; private Path mPath; //Path представляет собой множество отрезков public MyView(Context context) { super(context); mPaint = new Paint(); mPaint.setAntiAlias(true); //включить сглаживание mPaint.setColor(Color.BLACK); //цвет черный mPaint.setStrokeWidth(2f); //ширина контура 2 пикселя mPaint.setStyle(Paint.Style.FILL); //закрашивать примитивы черным цветом mPaint.setTextSize(50f); //размер шрифта для canvas.drawText() mPaint2 = new Paint(mPaint); //наследует все свойства mPaint mPaint2.setColor(Color.RED); //цвет - красный mPaint2.setStyle(Paint.Style.STROKE); //рисует контур примитивов красным цветом mPath = new Path(); //mPath можно было объявить и в onDraw(), но не рекомендуется //так как создание объектов в onDraw() может тормозить прорисовку } @Override protected void onDraw(Canvas canvas) { //вызывается каждый раз, как нужно перерисовать view canvas.drawRect(100, 100, 350, 200, mPaint); //закрашенный прямоугольник canvas.drawCircle(120, 350, 40, mPaint); //закрашенный круг canvas.drawText("Hello, world", 100, 450, mPaint); //черный текст canvas.drawLine(100, 580, 500, 520, mPaint); //черный отрезок mPath.reset(); //очищаем наш путь (вместо mPath = new Path()) mPath.moveTo(100, 700); //ставим первую вершину в точке (100, 700) mPath.lineTo(150, 900); //проводим прямую ко второй вершине mPath.lineTo(200, 600); //к третьей mPath.lineTo(100, 700); //замыкаем, получая треугольник canvas.drawPath(mPath, mPaint); //рисуем закрашенный треугольник mPath.reset(); mPath.moveTo(100 + 200, 700); mPath.lineTo(150 + 200, 900); mPath.lineTo(200 + 200, 600); mPath.lineTo(100 + 200, 700); canvas.drawPath(mPath, mPaint2); //рисуем треугольник с красным контуром canvas.translate(300, 1000); //все дальнейшие примитивы будут смещены на 300px вправо и 1000 вниз canvas.rotate(30); //и повернуты на 30 градусов canvas.drawText("Hello, world!", 10, 10, mPaint2); //рисует повернутый текст в точке (310, 1010) } }
Теперь наше приложение выглядит так:
