Transparent Status Bar in Android causes EditText hidden by keyboard - android

I make an Android application, following Google's material design guidelines.
So, I've implemented the latest support libraries (my min Sdk value is 14)
Now, I face to a problem : I've made the status bar transparent, with custom ToolBar (defined in a XML file). Everything works well, except that FloatingActionButton (from https://github.com/makovkastar/FloatingActionButton) skips XML's defined layout margin. Idem, one of my app's UI uses TextView to login the user : once focused, they're hidden by the soft keyboard.
These two problems came after replacing the main style from "AppCompat.DarkActionBar" to "AppCompat.NoActionBar" (and with item "android:windowTranslucentStatus" set to "true").
I tried to use windowSoftInputMode in my manifest with "adjustPan|adjustResize", but nothing change. Adding "ScrollView" to the layout with "EditText" inside doesn't solve my problem neither.
My english is bad, and I know that pictures are better than words, so here is what I want to do and what's happening :
(link to image) http://i.stack.imgur.com/fIRCl.png
Any ideas ? Thanks for reading !
EDIT : I solved my problem with the FloatingButton, just need to add this line to the component's XML declaration :
android:layout_alignParentBottom="true"
The only problem now is the keyboard that hides EditText.
Here is my code :
.
activity_main.xml
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="7dp"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- My toolbar -->
<include
android:id="#+id/tool_bar"
layout="#layout/toolbar_design">
</include>
<!-- Fragment's place -->
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true">
</FrameLayout> <!-- Open drawer bug fix -->
</LinearLayout>
<!-- Sliding Drawer -->
<ListView
android:id="#+id/list_slidermenu"
android:layout_width="300dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#null"
android:clipToPadding="false"
android:overScrollFooter="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#color/drawer_background"/>
</android.support.v4.widget.DrawerLayout>
toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/md_blue_800"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:elevation="4dp" >
</android.support.v7.widget.Toolbar>
fragment_profile.xml (the view with EditText's)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/container_dropshadow">
<!-- Top fragment's Image -->
<ImageView
android:layout_width="match_parent"
android:layout_height="150dp"
android:scaleType="centerCrop"
android:src="#drawable/top_image"/>
</LinearLayout>
<!-- Scrollview in case of screen's height is too small -->
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:id="#+id/rlFillProfile">
<!-- long long text ( 9 lines ) -->
<TextView
android:text="#string/text_edit_profile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:id="#+id/tvEditProfile" />
<!-- User ID EditText -->
<com.rengwuxian.materialedittext.MaterialEditText
android:layout_below="#id/tvEditProfile"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:maxLines="1"
android:singleLine="true"
android:maxEms="10"
android:hint="Your user ID"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:id="#+id/etUserID"
android:layout_alignLeft="#+id/etUserPassword"
android:layout_alignStart="#+id/etUserPassword" />
<!-- User ID TextView -->
<TextView
android:id="#+id/tvUserID"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Identifiant :"
android:textSize="18dp"
android:layout_marginBottom="16dp"
android:layout_alignBottom="#id/etUserID"
android:layout_alignRight="#+id/tvUserPassword"
android:layout_alignEnd="#+id/tvUserPassword" />
<!-- User password TextView -->
<com.rengwuxian.materialedittext.MaterialEditText
android:layout_below="#id/etUserID"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:maxLines="1"
android:singleLine="true"
android:maxEms="10"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:inputType="textPassword"
android:id="#+id/etUserPassword"
android:hint="******"
android:layout_toRightOf="#+id/tvUserPassword"
android:layout_toEndOf="#+id/tvUserPassword" />
<!-- User password TextView -->
<TextView
android:id="#+id/tvUserPassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mot de passe :"
android:textSize="18dp"
android:layout_alignBottom="#+id/etUserPassword"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<!-- Button to get user's touch event -->
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="Continuer"
android:id="#+id/button_disconnect"
android:layout_below="#id/etUserPassword"
android:layout_centerHorizontal="true" />
</RelativeLayout>
</ScrollView>
</LinearLayout>
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" ... >
<!-- Permissions -->
...
<application
... >
<activity
android:name="..."
android:label="#string/app_name"
android:screenOrientation="portrait"
android:configChanges="orientation|keyboardHidden"
android:windowSoftInputMode="adjustResize|stateHidden">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
In my MainActivity, I have the DrawerLayout and some codelines not in relationship with the Toolbar / layout, except for :
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
...
toolbar = (Toolbar) findViewById(R.id.tool_bar);
toolbar.setPadding(0, getStatusBarHeight(), 0, 0);
setSupportActionBar(toolbar);
// enabling action bar app icon and behaving it as toggle button
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setIcon(new ColorDrawable(getResources().getColor(android.R.color.transparent)));
...
}
// A method to find height of the status bar
// Source : an Stackoverflow's answer
public int getStatusBarHeight() {
int result = 0;
int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
if (resourceId > 0) {
result = getResources().getDimensionPixelSize(resourceId);
}
return result;
}

Ok, finally found a solution. Using this code in Fragment solves everything.
getActivity().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN | WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN);
By the way, use AppCompatActivity instead of ActionBarActivity (support V7), I'm not sure it changes something, but just in case ...
(From : this answer https://stackoverflow.com/a/28012530/5200029)

Related

How to centre a string in toolbar fragment?

I have the following part of XML which generates a toolbar in my profile fragment with a black background and profile written in it.
I'm trying though to center the profile but nothing seems to work. Any suggestions?
<fragment
android:id="#+id/navigation_home"
android:name="com.example.myapp_android.ui.home.HomeFragment"
android:label="#string/title_home"
tools:layout="#layout/fragment_home" />
I tried adding to the <fragment android:label_gravity = "center" and android:gravity = "center"
but none of them moved the profile text.
Toolbars can have childview so you can use TextView inside of a toolbar
Use this :
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toolbar"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Toolbar"
android:textSize="20sp"
android:textStyle="bold"/>
</androidx.appcompat.widget.Toolbar>

Android How to center title of top actionBar?

To start my objective is to center my title. I have started a project by selecting the bottom navigation activity template. This came with 3 fragments and a main activity. I am attempting to center the title of the top action bar. I have attempted to access the mobile_navigation by id and align the text within the MainActivity but this does not seem to work. I also tried adding a textAlignment attribute in the homeFragment.xml but this did not work either. I do not find any similar scenarios anyone know how could I be able to resolve this?
mobile_navigation.xml:
<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mobile_navigation"
app:startDestination="#+id/navigation_home">
<fragment
android:id="#+id/navigation_home"
android:name="com.Example.exmaple.ui.home.HomeFragment"
android:label="#string/app_name"
tools:layout="#layout/fragment_home" />
<fragment
android:id="#+id/navigation_dashboard"
android:name="com.Example.exmaple.ui.dashboard.DashboardFragment"
android:label="#string/title_dashboard"
tools:layout="#layout/fragment_dashboard" />
<fragment
android:id="#+id/navigation_notifications"
android:name="com.Example.exmaple.ui.notifications.NotificationsFragment"
android:label="#string/title_notifications"
tools:layout="#layout/fragment_notifications" />
</navigation>
I also attempted to add:
android:gravity="center"
Any feedback welcomed.
To use a custom title in your Toolbar all you need to do is remember is that Toolbar is just a fancy ViewGroup so you can add a custom title like so:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="#color/action_bar_bkgnd"
app:theme="#style/ToolBarTheme" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Toolbar Title"
android:layout_gravity="center"
android:id="#+id/toolbar_title" />
</android.support.v7.widget.Toolbar>
This means that you can style the TextView however you would like because it's just a regular TextView. So in your activity you can access the title like so:
Toolbar toolbarTop = (Toolbar) findViewById(R.id.toolbar_top);
TextView mTitle = (TextView) toolbarTop.findViewById(R.id.toolbar_title);
setSupportActionBar(toolbar);
mTitle.setText(toolbar.getTitle());
getSupportActionBar().setDisplayShowTitleEnabled(false);
Try below code may works for you
getSupportActionBar().setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
getSupportActionBar().setCustomView(R.layout.abs_layout);
Better add a layout file for tool bar and center the title there and add dynamically on create or include in your fragment layout file.
I was able to figure out the solution. I will post it incase anyone runs across this issue.
I added the following to the Main Activity xml:
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolBar"
android:elevation="5dp"
app:layout_constraintTop_toTopOf="parent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorBlack">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorTransparent"
android:layout_alignParentStart="true"
android:layout_gravity="start"
android:text="#string/log_out"
android:textAlignment="center"
android:textColor="#color/lightblue"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textColor="#color/colorApp"
android:textSize="20sp"/>
<ImageButton
android:layout_width="20dp"
android:layout_height="20dp"
android:src="#drawable/ic_add"
android:tint="#color/lightblue"
android:layout_alignParentEnd="true"
android:layout_gravity="end"
android:background="#color/colorBlack" />
</androidx.appcompat.widget.Toolbar>
I also took away the padding top from the androidx.constraintlayout.widget.ConstraintLayout opening tag in the Main Activity XML
Added the following style to styles.xml:
<style name="AppTheme.NoActionBar" parent="AppTheme">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
</style>
Finally in the Android manifest I added the following theme to the Main Acivity:
android:theme="#style/AppTheme.NoActionBar"

DrawerLayout with ListView does not process item clicks on Samsung Tab/Android 5.0.2

I'm using an android.support.v4.widget.DrawerLayout with com.android.support:appcompat-v7 in my main activity (which extends AppCompatActivity) to provide a navigation drawer, and ListView within the drawer to present user clickable items.
This all works perfectly well except on Samsung Tab devices running Android 5.0.2.
The code has been tested and works as expected on various versions of Android from 4.2.1 to 6.0.1, and works fine on an emulator running 5.0.2.
On the Samsung devices, the nav drawer is dismissed on the tap, but the new activity (e.g. MyPreferenceActivity or HelpPageActivity, in the code below) is never displayed.
My question: is there anything incorrect about the code or layout that might cause this not to work on Samsung Tab/5.0.2 devices?
The main activity is as follows:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent" android:gravity="fill"
android:background="#color/standard_bkgnd">
<include
android:id="#+id/toolbar_actionbar"
layout="#layout/toolbar_actionbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/toolbar_actionbar"
>
<!-- normal content view -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...main UI stuff...
</LinearLayout>
<!-- drawer view -->
<include layout="#layout/nav_drawer" />
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
The nav_drawer layout is as follows:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="280dp"
android:layout_height="match_parent"
android:background="#color/button_material_dark"
android:orientation="vertical"
android:layout_gravity="start">
<RelativeLayout
android:id="#+id/drawer_header"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#color/material_blue_grey_800"
android:padding="8dp" >
<ImageView
android:id="#+id/app_icon"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/ic_launcher_08"
android:layout_marginTop="15dp"
android:contentDescription="#string/app_icon"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="42dp"
android:layout_centerVertical="true"
android:layout_marginLeft="15dp"
android:layout_toRightOf="#+id/app_icon"
android:orientation="vertical" >
<TextView
android:id="#+id/app_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textColor="#fff"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginTop="4dp"
android:text="#string/app_long_name"
android:textColor="#fff"
android:textSize="12sp" />
</LinearLayout>
</RelativeLayout>
<ListView
android:id="#+id/nav_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/drawer_header"
android:choiceMode="singleChoice"/>
</RelativeLayout>
The ListView is configured to present a number of items that user can click to view other content within the app, or perform other activities:
// Drawer Item click listeners
drawerList.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
switch (position) {
case 0: // preferences
startActivity(new Intent(that, MyPreferenceActivity.class));
break;
case 1: // help
startActivity(new Intent(that, HelpPageActivity.class));
break;
case 2: // send feedback
composeEmail();
break;
default:
break;
}
_drawerLayout.postDelayed(new Runnable() {
#Override
public void run() {
_drawerLayout.closeDrawers();
}
}, 500);
drawerList.clearChoices();
}
});
Any suggestions much appreciated!
So, it turns out not to have been anything to do with Samsung Tab/5.0.2 after all - it was coincidence that the only reports of problems I'd had came from those devices.
The problem was that I had a landscape layout for my main activity which had the order of the normal content view and the drawer view reversed, which prevented the ListItems receiving the click event:
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/toolbar_actionbar"
>
<!-- normal content view -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...main UI stuff...
</LinearLayout>
<!-- drawer view *** this must come after the normal content view *** -->
<include layout="#layout/nav_drawer" />
</android.support.v4.widget.DrawerLayout>
As soon as I switched them around, things worked as expected. Doh.

How can I add divider between action Items in Toolbar

I want to design a toolbar like:.
I have done most of it but having some problem.
I don't know how to make a divider between the toolbars items and also having no idea how to set a counter variable attached to the action button that increment as order takes place like given in the picture.
Any suggestions?
You can place your layout like below:
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/..."
android:showAsAction="always."
android:icon="#drawable/..."
android:title="#string/..."
android:actionLayout="#layout/your_layout_here"/>
or
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/..."
android:showAsAction="always."
android:icon="#drawable/..."
android:title="#string/..."
android:actionViewClass="your_class"/>
where "your_class" - class which inflate and implement your view with separator
Try to create a custom toolbar. Add your views between the toolbar's opening and closing tags.
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="56dip"
android:background="#ff0000">
<!-- the back button -->
<ImageView
android:id="#+id/backButton"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="left"
android:clickable="true"
android:onClick="onBackButtonClick"
android:paddingLeft="16dip"
android:paddingRight="16dip"
android:src="#drawable/ic_back" />
...
<!-- the devider -->
<View
android:layout_width="1dip"
android:layout_height="match_parent"
android:background="#ffffff" />
<ImageView .../>
</android.support.v7.widget.Toolbar>

Android CustomListView overlapping other components

In my application I have a header (at the top) and a footer(at the bottom) and a CustomListView inside. I have made the HEADER & FOOTER stationary and they won't scroll. But the ListView which is placed between them, has some components which are overlapping the FOOTER. I somehow want those components in my CustomListView not to overlap the footer. Is there any way this can be done?
The code for my layout is given below-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- Title Bar -->
<include
android:id="#+id/title_bar"
android:layout_alignParentTop="true"
layout="#layout/title_bar" />
<!-- Settings Components list -->
<ListView
android:id="#+id/custom_items_list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title_bar"
android:layout_weight="1" >
</ListView>
<!-- Options Bar -->
<include
android:id="#+id/options_bar"
style="#style/btn_options_bar"
android:layout_alignParentBottom="true"
layout="#layout/options_bar" />
</RelativeLayout>
Have you tried adding android:layout_above="#id/options_bar" to the ListView? To do so you would also have to move the declaration of the footer to be above the ListView in the layout file so that you are not referencing an id that hasn't been declared yet. But even though the options bar would be listed in the layout before the ListView, it would still get displayed below it because of the options_bar layout_alignParentBottom="true".
I finally found the problem. The problem was, (I don't know why but) I needed to set the layout_height and layout_weight again after <include>
For those who are interested, updated xml is-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- Title Bar -->
<include
android:id="#+id/title_bar"
android:layout_alignParentTop="true"
layout="#layout/title_bar" />
<!-- Options Bar -->
<include
android:id="#+id/options_bar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
style="#style/btn_options_bar"
android:layout_alignParentBottom="true"
layout="#layout/options_bar" />
<!-- Settings components' list -->
<ListView
android:id="#+id/custom_items_list"
android:layout_above="#id/options_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title_bar">
</ListView>
</RelativeLayout>

Categories

Resources