Creating a timer app with a muddy
** Easy timer with various functions **
I had to write it on December 10, 2019, but it's been over the year.
Then, I will introduce this time ↓
_ "Timer" app! !! !! _
In addition to start, stop, and reset, I added simple functions (functions that I don't really need).
This is the completed image. ↓
Things necessary
・ PC
・ Android Studio (mainly 3.0.1)
** _App Creation-1 Preparation _ **
Create the project as usual.
-The API level is 26 (android8.0).
-Empty is specified as the activity type.
** App Creation-2 Screen Creation**
Let's arrange the buttons on the screen.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
~abridgement~
>
<TextView
android:id="@+id/text_view_countdown"
android:layout_width="395dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginEnd="7dp"
android:layout_marginStart="7dp"
android:gravity="center"
android:text="@string/_00_00"
android:textColor="@android:color/black"
android:textSize="40sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.48"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.280" />
<Button
android:id="@+id/button_start_pause"
android:layout_width="395dp"
android:layout_height="43dp"
android:layout_below="@+id/text_view_countdown"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:text="@string/start"
app:layout_constraintBottom_toTopOf="@+id/button_reset"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/text_view_countdown" />
<Button
android:id="@+id/button_reset"
android:layout_width="395dp"
android:layout_height="wrap_content"
android:layout_below="@+id/button_start_pause"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:text="@string/reset"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button_start_pause"
tools:visibility="visible" />
<Button
android:id="@+id/button_pause"
android:layout_width="395dp"
android:layout_height="wrap_content"
android:layout_below="@+id/button_reset"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:text="@string/pause"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button_reset"
tools:visibility="visible" />
<Button
android:id="@+id/button_skip"
android:layout_width="395dp"
android:layout_height="wrap_content"
android:layout_below="@+id/button_pause"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:text="@string/skip"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button_pause"
tools:visibility="visible" />
<Button
android:id="@+id/button_return"
android:layout_width="395dp"
android:layout_height="wrap_content"
android:layout_below="@+id/button_skip"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:text="@string/not_return"
android:visibility="invisible"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button_skip"
tools:visibility="visible" />
</android.support.constraint.ConstraintLayout>
Yes, this is View. (Android.support.constraint.ConstraintLayout varies from person to person.)
android:text="@string/pause"
I think that an error will occur, so I will add strings.xml this time.
<resources>
<string name="app_name">timer</string>
<string name="_00_00">00:00</string>
<string name = "start"> Start </ string>
<string name = "reset"> reset </ string>
<string name="stop">STOP</string>
<string name = "pause"> The World </ string>
<string name = "skip"> King Crimson </ string>
<string name="not_return">GER</string>
</resources>
Yes, let's name the pause and skip buttons appropriately
I think that the screen can now be displayed.
** App Creation-3 Timer Processing 1 **
I will write the processing when each button on the screen is pressed in MainActivity.java! !!
But
First, define the field variables.
public class MainActivity extends AppCompatActivity {
// Timer setting unit milliseconds
private static final long START_TIME_IN_MILLIS = 180000;
// Pause setting unit milliseconds
private static final long PAUSE_IN_MILLIS = 7000;
// Skip setting Unit Millisecond
private static final long SKIP_TIME_IN_MILLIS = 5000;
//カウントダウンタイマー
private TextView mTextCountDown;
//ボタン
private Button mButtonStart; // Start
private Button mButtonReset; // Reset
private Button mButtonPause; // Pause
private Button mButtonSkip; // Skip
private Button mButtonReturn; // Return
//CountDownTimerクラス
private CountDownTimer mCountDownTimer;
//CallTimeクラス
private boolean mTimerRunning;
private long mTime = START_TIME_IN_MILLIS;
@Override
protected void onCreate(Bundle savedInstanceState) {
~abridgement~
Here you define the initial time of the timer, the stop time of the pause, and the time to skip the skip.
** _App Creation-3 Timer Processing 2 _ **
Write the behavior when each button is pressed first!
// ~ There is a protected void onCreate (Bundle savedInstanceState) above. ~
//タイマー再開の処理
private void startTimer() {
mCountDownTimer = new CountDownTimer(mTime,1000) {
@Override
public void onTick(long millisUntilFinished) {
mTime = millisUntilFinished;
updateCountDownText();
}
@Override
public void onFinish() {
mTimerRunning = false; // Timer stopped
mTime = START_TIME_IN_MILLIS;
mButtonStart.setText ("start");
mButtonReset.setVisibility(View.INVISIBLE);
mButtonPause.setVisibility(View.INVISIBLE);
mButtonSkip.setVisibility(View.INVISIBLE);
mButtonReturn.setVisibility(View.INVISIBLE);
}
}.start();
mTimerRunning = true; // Timer running
mButtonStart.setText ("pause");
mButtonReset.setVisibility(View.VISIBLE);
mButtonPause.setVisibility(View.VISIBLE);
mButtonSkip.setVisibility(View.VISIBLE);
mButtonReturn.setVisibility(View.VISIBLE);
}
//タイマー一時停止の処理
private void pauseTimer() {
mCountDownTimer.cancel();
mTimerRunning = false;
mButtonStart.setText ("start");
mButtonReset.setVisibility(View.VISIBLE);
}
//タイマーリセットの処理
private void resetTimer() {
mTime = START_TIME_IN_MILLIS;
updateCountDownText();
mCountDownTimer.cancel();
mButtonStart.setText ("start");
mTimerRunning = false;
mButtonStart.setVisibility(View.VISIBLE);
mButtonReset.setVisibility(View.INVISIBLE);
mButtonPause.setVisibility(View.INVISIBLE);
mButtonSkip.setVisibility(View.INVISIBLE);
mButtonReturn.setVisibility(View.INVISIBLE);
}
//タイマー表示
private void updateCountDownText() {
int minutes = (int)(mTime / 1000) / 60;
int seconds = (int)(mTime / 1000) % 60;
String timeFormatted = String.format(Locale.getDefault(), "%02d:%02d",minutes,seconds);
mTextCountDown.setText(timeFormatted);
}
With this, I wrote the process that moves when the button is pressed.
Basically, it feels like skipping or stopping is realized by applying "stop timer".
** _App Creation-3 Timer Processing 3 _ **
Implement onClick on the button so that it works when pressed
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mTextCountDown = findViewById(R.id.text_view_countdown);
mButtonStart = findViewById(R.id.button_start_pause);
mButtonReset = findViewById(R.id.button_reset);
mButtonPause = findViewById(R.id.button_pause);
mButtonSkip = findViewById(R.id.button_skip);
mButtonReturn = findViewById(R.id.button_return);
//スタートボタン
mButtonStart.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//タイマーの状態を取得
if (mTimerRunning) {
//動いてるなら停止
pauseTimer();
} else {
startTimer();
}
}
});
//リセットボタン
mButtonReset.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//タイマーのリセット
resetTimer();
}
});
//一時停止ボタン
mButtonPause.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//タイマーを停止
mCountDownTimer.cancel();
//7秒後実行
new Handler(Looper.getMainLooper()).postDelayed(new Runnable() {
@Override
public void run() {
//タイマーの再開
startTimer();
}
}, PAUSE_IN_MILLIS);
}
});
//スキップボタン
mButtonSkip.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//タイマーを停止
mCountDownTimer.cancel();
int futureTime = (int)(mTime - SKIP_TIME_IN_MILLIS);
//残り時間が0以上あるならスキップ
if (futureTime >= 0) {
mTime = futureTime;
int minutes = (futureTime / 1000) / 60;
int seconds = (futureTime / 1000) % 60;
String timeFormatted = String.format(Locale.getDefault(), "%02d:%02d",minutes,seconds);
mTextCountDown.setText(timeFormatted);
//残り時間0になるならリセット
} else {
resetTimer();
}
startTimer();
}
});
//戻るボタン
mButtonReturn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
resetTimer();
startTimer();
}
});
updateCountDownText();
}
If you write so far, you can operate it as a timer. Please compile it and run it on the actual machine.
** _ Postscript _ **
Thank you for reading.
Most of the source is solid, but I didn't write much because I just used CountDownTimer.
(I wanted to add various other things, but due to time constraints, I'll do it so far. It's almost a month overdue.)
At first, I was thinking of making it a counter app. (Every time you press the button, it counts up and the durandal sticks from top to bottom in the animation)
To Be Continued
Recommended Posts