Change ShowHidePasswordEditText to TextInputEditText.

change the input fields in the AccountActivity to use the TextInputLayout.

7 files changed, 144 insertions, 145 deletions

diff --git a/src/main/java/de/pixart/messenger/ui/ChangePasswordActivity.java b/src/main/java/de/pixart/messenger/ui/ChangePasswordActivity.java
index 49a826f29..b73393b0c 100644
--- a/src/main/java/de/pixart/messenger/ui/ChangePasswordActivity.java
+++ b/src/main/java/de/pixart/messenger/ui/ChangePasswordActivity.java
@@ -5,7 +5,6 @@ import android.os.Bundle;
 import android.view.View;
 import android.widget.Button;
 import android.widget.EditText;
-import android.widget.TextView;
 import android.widget.Toast;
 
 import de.pixart.messenger.R;
@@ -21,20 +20,15 @@ public class ChangePasswordActivity extends XmppActivity implements XmppConnecti
             if (mAccount != null) {
                 final String currentPassword = mCurrentPassword.getText().toString();
                 final String newPassword = mNewPassword.getText().toString();
-                final String newPasswordConfirm = mNewPasswordConfirm.getText().toString();
                 if (!mAccount.isOptionSet(Account.OPTION_MAGIC_CREATE) && !currentPassword.equals(mAccount.getPassword())) {
                     mCurrentPassword.requestFocus();
                     mCurrentPassword.setError(getString(R.string.account_status_unauthorized));
-                } else if (!newPassword.equals(newPasswordConfirm)) {
-                    mNewPasswordConfirm.requestFocus();
-                    mNewPasswordConfirm.setError(getString(R.string.passwords_do_not_match));
                 } else if (newPassword.trim().isEmpty()) {
                     mNewPassword.requestFocus();
                     mNewPassword.setError(getString(R.string.password_should_not_be_empty));
                 } else {
                     mCurrentPassword.setError(null);
                     mNewPassword.setError(null);
-                    mNewPasswordConfirm.setError(null);
                     xmppConnectionService.updateAccountPasswordOnServer(mAccount, newPassword, ChangePasswordActivity.this);
                     mChangePasswordButton.setEnabled(false);
                     mChangePasswordButton.setTextColor(getSecondaryTextColor());
@@ -43,20 +37,16 @@ public class ChangePasswordActivity extends XmppActivity implements XmppConnecti
             }
         }
     };
-    private TextView mCurrentPasswordLabel;
     private EditText mCurrentPassword;
     private EditText mNewPassword;
-    private EditText mNewPasswordConfirm;
     private Account mAccount;
 
     @Override
     void onBackendConnected() {
         this.mAccount = extractAccount(getIntent());
         if (this.mAccount != null && this.mAccount.isOptionSet(Account.OPTION_MAGIC_CREATE)) {
-            this.mCurrentPasswordLabel.setVisibility(View.GONE);
             this.mCurrentPassword.setVisibility(View.GONE);
         } else {
-            this.mCurrentPasswordLabel.setVisibility(View.VISIBLE);
             this.mCurrentPassword.setVisibility(View.VISIBLE);
         }
     }
@@ -74,10 +64,8 @@ public class ChangePasswordActivity extends XmppActivity implements XmppConnecti
         });
         this.mChangePasswordButton = findViewById(R.id.right_button);
         this.mChangePasswordButton.setOnClickListener(this.mOnChangePasswordButtonClicked);
-        this.mCurrentPasswordLabel = findViewById(R.id.current_password_label);
         this.mCurrentPassword = findViewById(R.id.current_password);
         this.mNewPassword = findViewById(R.id.new_password);
-        this.mNewPasswordConfirm = findViewById(R.id.new_password_confirm);
     }
 
     @Override
diff --git a/src/main/java/de/pixart/messenger/ui/EditAccountActivity.java b/src/main/java/de/pixart/messenger/ui/EditAccountActivity.java
index 41d48af99..d407f26ac 100644
--- a/src/main/java/de/pixart/messenger/ui/EditAccountActivity.java
+++ b/src/main/java/de/pixart/messenger/ui/EditAccountActivity.java
@@ -1,6 +1,5 @@
 package de.pixart.messenger.ui;
 
-import android.support.v7.app.AlertDialog;
 import android.app.AlertDialog.Builder;
 import android.app.PendingIntent;
 import android.content.ActivityNotFoundException;
@@ -10,11 +9,14 @@ import android.content.SharedPreferences;
 import android.graphics.Bitmap;
 import android.net.Uri;
 import android.os.Bundle;
+import android.os.Handler;
 import android.provider.Settings;
 import android.security.KeyChain;
 import android.security.KeyChainAliasCallback;
+import android.support.design.widget.TextInputLayout;
 import android.support.v4.content.ContextCompat;
 import android.support.v7.app.ActionBar;
+import android.support.v7.app.AlertDialog;
 import android.text.Editable;
 import android.text.TextWatcher;
 import android.view.Menu;
@@ -73,7 +75,6 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
     private static final int REQUEST_DATA_SAVER = 0x37af244;
     private AutoCompleteTextView mAccountJid;
     private EditText mPassword;
-    private EditText mPasswordConfirm;
     private CheckBox mRegisterNew;
     private Button mCancelButton;
     private Button mSaveButton;
@@ -100,7 +101,7 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
     private TextView mOwnFingerprintDesc;
     private TextView mOtrFingerprintDesc;
  	private TextView getmPgpFingerprintDesc;
-    private TextView mAccountJidLabel;
+    private TextInputLayout mPasswordToggle;
     private ImageView mAvatar;
     private RelativeLayout mOtrFingerprintBox;
     private RelativeLayout mAxolotlFingerprintBox;
@@ -129,7 +130,6 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         @Override
         public void onClick(final View v) {
             final String password = mPassword.getText().toString();
-            final String passwordConfirm = mPasswordConfirm.getText().toString();
             final boolean wasDisabled = mAccount != null && mAccount.getStatus() == Account.State.DISABLED;
 
             if (!mInitMode && passwordChangedInMagicCreateMode()) {
@@ -222,11 +222,6 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
                 if (XmppConnection.errorMessage != null) {
                     Toast.makeText(EditAccountActivity.this, XmppConnection.errorMessage, Toast.LENGTH_LONG).show();
                 }
-                if (!password.equals(passwordConfirm)) {
-                    mPasswordConfirm.setError(getString(R.string.passwords_do_not_match));
-                    mPasswordConfirm.requestFocus();
-                    return;
-                }
             }
             if (mAccount != null) {
                 if (mInitMode && mAccount.isOptionSet(Account.OPTION_MAGIC_CREATE)) {
@@ -240,7 +235,6 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
                 } else {
                     mAccountJid.setError(null);
                 }
-                mPasswordConfirm.setError(null);
                 mAccount.setPassword(password);
                 mAccount.setOption(Account.OPTION_REGISTER, registerNewAccount);
                 if (!xmppConnectionService.updateAccount(mAccount)) {
@@ -288,6 +282,7 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
     private boolean mSavedInstanceInit = false;
     private Button mClearDevicesButton;
     private XmppUri pendingUri = null;
+    private boolean mUseTor;
 
     public void refreshUiReal() {
         invalidateOptionsMenu();
@@ -371,6 +366,24 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         }
     };
 
+    private View.OnFocusChangeListener mEditTextFocusListener = new View.OnFocusChangeListener() {
+        @Override
+        public void onFocusChange(View view, boolean b) {
+            EditText et = (EditText) view;
+            if (b) {
+                int resId = mUsernameMode ? R.string.username : R.string.account_settings_example_jabber_id;
+                if (view.getId() == R.id.hostname) {
+                    resId = mUseTor ? R.string.hostname_or_onion : R.string.hostname_example;
+                }
+                final int res = resId;
+                new Handler().postDelayed(() -> et.setHint(res), 500);
+            } else {
+                et.setHint(null);
+            }
+        }
+    };
+
+
     private final OnClickListener mAvatarClickListener = new OnClickListener() {
         @Override
         public void onClick(final View view) {
@@ -529,10 +542,10 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         setContentView(R.layout.activity_edit_account);
         this.mAccountJid = findViewById(R.id.account_jid);
         this.mAccountJid.addTextChangedListener(this.mTextWatcher);
-        this.mAccountJidLabel = findViewById(R.id.account_jid_label);
+        this.mAccountJid.setOnFocusChangeListener(this.mEditTextFocusListener);
         this.mPassword = findViewById(R.id.account_password);
         this.mPassword.addTextChangedListener(this.mTextWatcher);
-        this.mPasswordConfirm = findViewById(R.id.account_password_confirm);
+        this.mPasswordToggle = findViewById(R.id.text_input_password_toggle);
         this.mAvatar = findViewById(R.id.avater);
         this.mAvatar.setOnClickListener(this.mAvatarClickListener);
         this.mRegisterNew = findViewById(R.id.account_register_new);
@@ -569,6 +582,7 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         this.mNamePort = findViewById(R.id.name_port);
         this.mHostname = findViewById(R.id.hostname);
         this.mHostname.addTextChangedListener(mTextWatcher);
+        this.mHostname.setOnFocusChangeListener(mEditTextFocusListener);
         this.mClearDevicesButton = findViewById(R.id.clear_devices);
         this.mClearDevicesButton.setOnClickListener(new OnClickListener() {
             @Override
@@ -589,13 +603,7 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         }
         final OnCheckedChangeListener OnCheckedShowConfirmPassword = new OnCheckedChangeListener() {
             @Override
-            public void onCheckedChanged(final CompoundButton buttonView,
-                                         final boolean isChecked) {
-                if (isChecked) {
-                    mPasswordConfirm.setVisibility(View.VISIBLE);
-                } else {
-                    mPasswordConfirm.setVisibility(View.GONE);
-                }
+            public void onCheckedChanged(final CompoundButton buttonView, final boolean isChecked) {
                 updateSaveButton();
             }
         };
@@ -704,9 +712,8 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
             }
         }
         SharedPreferences preferences = getPreferences();
-        boolean useTor = Config.FORCE_ORBOT || preferences.getBoolean("use_tor", false);
-        this.mShowOptions = useTor || preferences.getBoolean("show_connection_options", false);
-        mHostname.setHint(useTor ? R.string.hostname_or_onion : R.string.hostname_example);
+        mUseTor = Config.FORCE_ORBOT || preferences.getBoolean("use_tor", false);
+        this.mShowOptions = mUseTor || preferences.getBoolean("show_connection_options", false);
         this.mNamePort.setVisibility(mShowOptions ? View.VISIBLE : View.GONE);
     }
 
@@ -769,7 +776,6 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
             this.mCancelButton.setTextColor(getSecondaryTextColor());
         }
         if (mUsernameMode) {
-            this.mAccountJidLabel.setText(R.string.username);
             this.mAccountJid.setHint(R.string.username_hint);
         } else {
             final KnownHostsAdapter mKnownHostsAdapter = new KnownHostsAdapter(this,
@@ -911,6 +917,7 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         this.mAccountJid.setEnabled(editable);
         this.mAccountJid.setFocusable(editable);
         this.mAccountJid.setFocusableInTouchMode(editable);
+        this.mPasswordToggle.setPasswordVisibilityToggleEnabled(editable);
 
         if (!mInitMode) {
             this.mAvatar.setVisibility(View.VISIBLE);
@@ -922,7 +929,6 @@ public class EditAccountActivity extends OmemoActivity implements OnAccountUpdat
         if (this.mAccount.isOptionSet(Account.OPTION_REGISTER)) {
             this.mRegisterNew.setVisibility(View.VISIBLE);
             this.mRegisterNew.setChecked(true);
-            this.mPasswordConfirm.setText(this.mAccount.getPassword());
         } else {
             this.mRegisterNew.setVisibility(View.GONE);
             this.mRegisterNew.setChecked(false);
diff --git a/src/main/res/drawable/ic_visibility.xml b/src/main/res/drawable/ic_visibility.xml
new file mode 100644
index 000000000..57ba4f002
--- /dev/null
+++ b/src/main/res/drawable/ic_visibility.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24.0"
+    android:viewportHeight="24.0">
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M12,4.5C7,4.5 2.73,7.61 1,12c1.73,4.39 6,7.5 11,7.5s9.27,-3.11 11,-7.5c-1.73,-4.39 -6,-7.5 -11,-7.5zM12,17c-2.76,0 -5,-2.24 -5,-5s2.24,-5 5,-5 5,2.24 5,5 -2.24,5 -5,5zM12,9c-1.66,0 -3,1.34 -3,3s1.34,3 3,3 3,-1.34 3,-3 -1.34,-3 -3,-3z"/>
+</vector>
\ No newline at end of file
diff --git a/src/main/res/drawable/ic_visibility_off.xml b/src/main/res/drawable/ic_visibility_off.xml
new file mode 100644
index 000000000..fd954d349
--- /dev/null
+++ b/src/main/res/drawable/ic_visibility_off.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24.0"
+    android:viewportHeight="24.0">
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M12,7c2.76,0 5,2.24 5,5 0,0.65 -0.13,1.26 -0.36,1.83l2.92,2.92c1.51,-1.26 2.7,-2.89 3.43,-4.75 -1.73,-4.39 -6,-7.5 -11,-7.5 -1.4,0 -2.74,0.25 -3.98,0.7l2.16,2.16C10.74,7.13 11.35,7 12,7zM2,4.27l2.28,2.28 0.46,0.46C3.08,8.3 1.78,10.02 1,12c1.73,4.39 6,7.5 11,7.5 1.55,0 3.03,-0.3 4.38,-0.84l0.42,0.42L19.73,22 21,20.73 3.27,3 2,4.27zM7.53,9.8l1.55,1.55c-0.05,0.21 -0.08,0.43 -0.08,0.65 0,1.66 1.34,3 3,3 0.22,0 0.44,-0.03 0.65,-0.08l1.55,1.55c-0.67,0.33 -1.41,0.53 -2.2,0.53 -2.76,0 -5,-2.24 -5,-5 0,-0.79 0.2,-1.53 0.53,-2.2zM11.84,9.02l3.15,3.15 0.02,-0.16c0,-1.66 -1.34,-3 -3,-3l-0.17,0.01z"/>
+</vector>
\ No newline at end of file
diff --git a/src/main/res/drawable/visibility_toggle_drawable.xml b/src/main/res/drawable/visibility_toggle_drawable.xml
new file mode 100644
index 000000000..9c887e7e9
--- /dev/null
+++ b/src/main/res/drawable/visibility_toggle_drawable.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="@drawable/ic_visibility" android:state_checked="true" />
+    <item android:drawable="@drawable/ic_visibility_off" android:state_checked="false" />
+</selector>
\ No newline at end of file
diff --git a/src/main/res/layout/activity_change_password.xml b/src/main/res/layout/activity_change_password.xml
index 8808227e3..de1ad216d 100644
--- a/src/main/res/layout/activity_change_password.xml
+++ b/src/main/res/layout/activity_change_password.xml
@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:background="@color/grey200">
@@ -12,67 +13,54 @@
         <LinearLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_marginBottom="@dimen/activity_vertical_margin"
             android:layout_marginLeft="@dimen/activity_horizontal_margin"
             android:layout_marginRight="@dimen/activity_horizontal_margin"
             android:layout_marginTop="@dimen/activity_vertical_margin"
-            android:layout_marginBottom="@dimen/activity_vertical_margin"
             android:background="@drawable/infocard_border"
-            android:padding="@dimen/infocard_padding"
-            android:orientation="vertical">
+            android:orientation="vertical"
+            android:padding="@dimen/infocard_padding">
 
-            <TextView
-                android:id="@+id/current_password_label"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="@string/current_password"
-                android:textColor="@color/black87"
-                android:textSize="?attr/TextSizeBody" />
-
-            <EditText
-                android:id="@+id/current_password"
+            <android.support.design.widget.TextInputLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:layout_marginBottom="8dp"
-                android:hint="@string/password"
-                android:inputType="textPassword"
-                android:textColor="@color/black87"
-                android:textColorHint="@color/black54"
-                android:textSize="?attr/TextSizeBody" />
-
-            <TextView
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="@string/new_password"
-                android:textColor="@color/black87"
-                android:textSize="?attr/TextSizeBody" />
+                app:passwordToggleDrawable="@drawable/visibility_toggle_drawable"
+                app:passwordToggleEnabled="true"
+                app:passwordToggleTint="?attr/color_text_secondary">
 
-            <EditText
-                android:id="@+id/new_password"
-                android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_marginBottom="8dp"
-                android:hint="@string/password"
-                android:inputType="textPassword"
-                android:textColor="@color/black87"
-                android:textColorHint="@color/black54"
-                android:textSize="?attr/TextSizeBody" />
 
-            <TextView
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:text="@string/account_settings_confirm_password"
-                android:textColor="@color/black87"
-                android:textSize="?attr/TextSizeBody" />
+                <android.support.design.widget.TextInputEditText
+                    android:id="@+id/current_password"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_alignParentTop="true"
+                    android:layout_marginBottom="8dp"
+                    android:hint="@string/current_password"
+                    android:inputType="textPassword"
+                    android:textColor="?attr/color_text_primary"
+                    android:textColorHint="?attr/color_text_secondary"
+                    android:textSize="?attr/TextSizeBody" />
+            </android.support.design.widget.TextInputLayout>
 
-            <EditText
-                android:id="@+id/new_password_confirm"
+            <android.support.design.widget.TextInputLayout
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:hint="@string/password"
-                android:inputType="textPassword"
-                android:textColor="@color/black87"
-                android:textColorHint="@color/black54"
-                android:textSize="?attr/TextSizeBody" />
+                app:passwordToggleDrawable="@drawable/visibility_toggle_drawable"
+                app:passwordToggleEnabled="true"
+                app:passwordToggleTint="?attr/color_text_secondary">
+
+                <android.support.design.widget.TextInputEditText
+                    android:id="@+id/new_password"
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_alignParentTop="true"
+                    android:layout_marginBottom="8dp"
+                    android:hint="@string/new_password"
+                    android:inputType="textPassword"
+                    android:textColor="?attr/color_text_primary"
+                    android:textColorHint="?attr/color_text_secondary"
+                    android:textSize="?attr/TextSizeBody" />
+            </android.support.design.widget.TextInputLayout>
         </LinearLayout>
     </ScrollView>
 
diff --git a/src/main/res/layout/activity_edit_account.xml b/src/main/res/layout/activity_edit_account.xml
index 7b60b7a64..9b9611e99 100644
--- a/src/main/res/layout/activity_edit_account.xml
+++ b/src/main/res/layout/activity_edit_account.xml
@@ -51,42 +51,40 @@
                     android:layout_below="@+id/avater"
                     android:orientation="vertical">
 
-                    <TextView
-                        android:id="@+id/account_jid_label"
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:text="@string/account_settings_jabber_id"
-                        android:textColor="@color/black87"
-                        android:textSize="?attr/TextSizeBody" />
-
-                    <AutoCompleteTextView
-                        android:id="@+id/account_jid"
+                    <android.support.design.widget.TextInputLayout
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
-                        android:hint="@string/account_settings_example_jabber_id"
-                        android:inputType="textEmailAddress"
-                        android:imeOptions="actionNext"
-                        android:textColor="@color/black87"
-                        android:textColorHint="@color/black54"
-                        android:textSize="?attr/TextSizeBody" />
+                        android:hint="@string/account_settings_jabber_id">
 
-                    <TextView
-                        android:layout_width="wrap_content"
-                        android:layout_height="wrap_content"
-                        android:layout_marginTop="8dp"
-                        android:text="@string/account_settings_password"
-                        android:textColor="@color/black87"
-                        android:textSize="?attr/TextSizeBody" />
+                        <AutoCompleteTextView
+                            android:id="@+id/account_jid"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:imeOptions="actionNext"
+                            android:inputType="textEmailAddress"
+                            android:textColor="?attr/color_text_primary"
+                            android:textColorHint="?attr/color_text_secondary"
+                            android:textSize="?attr/TextSizeBody" />
+                    </android.support.design.widget.TextInputLayout>
 
-                    <EditText
-                        android:id="@+id/account_password"
+                    <android.support.design.widget.TextInputLayout
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
-                        android:hint="@string/password"
-                        android:inputType="textPassword"
-                        android:textColor="@color/black87"
-                        android:textColorHint="@color/black54"
-                        android:textSize="?attr/TextSizeBody" />
+                        android:id="@+id/text_input_password_toggle"
+                        app:passwordToggleDrawable="@drawable/visibility_toggle_drawable"
+                        app:passwordToggleEnabled="true"
+                        app:passwordToggleTint="?attr/color_text_secondary">
+
+                        <android.support.design.widget.TextInputEditText
+                            android:id="@+id/account_password"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:hint="@string/password"
+                            android:inputType="textPassword"
+                            android:textColor="@color/black87"
+                            android:textColorHint="@color/black54"
+                            android:textSize="?attr/TextSizeBody" />
+                    </android.support.design.widget.TextInputLayout>
 
                     <LinearLayout
                         android:id="@+id/name_port"
@@ -102,23 +100,20 @@
                             android:layout_weight="0.8"
                             android:orientation="vertical">
 
-                            <TextView
-                                android:id="@+id/textView"
-                                android:layout_width="wrap_content"
-                                android:layout_height="wrap_content"
-                                android:text="@string/account_settings_hostname"
-                                android:textColor="@color/black87"
-                                android:textSize="?attr/TextSizeBody" />
-
-                            <EditText
-                                android:id="@+id/hostname"
-                                android:layout_width="fill_parent"
+                            <android.support.design.widget.TextInputLayout
+                                android:layout_width="match_parent"
                                 android:layout_height="wrap_content"
-                                android:hint="@string/hostname_or_onion"
-                                android:inputType="textNoSuggestions"
-                                android:textColor="@color/black87"
-                                android:textColorHint="@color/black54"
-                                android:textSize="?attr/TextSizeBody" />
+                                android:hint="@string/account_settings_hostname">
+
+                                <EditText
+                                    android:id="@+id/hostname"
+                                    android:layout_width="fill_parent"
+                                    android:layout_height="wrap_content"
+                                    android:inputType="textNoSuggestions"
+                                    android:textColor="?attr/color_text_primary"
+                                    android:textColorHint="?attr/color_text_secondary"
+                                    android:textSize="?attr/TextSizeBody" />
+                            </android.support.design.widget.TextInputLayout>
                         </LinearLayout>
 
                         <LinearLayout
@@ -127,22 +122,21 @@
                             android:layout_weight="0.2"
                             android:orientation="vertical">
 
-                            <TextView
-                                android:layout_width="wrap_content"
-                                android:layout_height="wrap_content"
-                                android:text="@string/account_settings_port"
-                                android:textColor="@color/black87"
-                                android:textSize="?attr/TextSizeBody" />
-
-                            <EditText
-                                android:id="@+id/port"
+                            <android.support.design.widget.TextInputLayout
                                 android:layout_width="match_parent"
                                 android:layout_height="match_parent"
-                                android:inputType="number"
-                                android:maxLength="5"
-                                android:textColor="@color/black87"
-                                android:textColorHint="@color/black54"
-                                android:textSize="?attr/TextSizeBody" />
+                                android:hint="@string/account_settings_port">
+
+                                <EditText
+                                    android:id="@+id/port"
+                                    android:layout_width="match_parent"
+                                    android:layout_height="match_parent"
+                                    android:inputType="number"
+                                    android:maxLength="5"
+                                    android:textColor="?attr/color_text_primary"
+                                    android:textColorHint="?attr/color_text_secondary"
+                                    android:textSize="?attr/TextSizeBody" />
+                            </android.support.design.widget.TextInputLayout>
                         </LinearLayout>
                     </LinearLayout>