Android: Unwanted White Box at Top of Screen (toolbar?) - android

How do I get rid of the white box at the top of the android view? I cannot see anywhere in my code where I called something that created the toolbar, nor did I code it myself. It also exists above the view, not in it. I'm guessing there is some setting in the design view of the xml file that can toggle it? Thanks in advance!
** I should also include that it is only on this activity, and my other activities do not have this white bar at the top. Furthermore, the actionbar is the thin blue bar above the white car, so any code that involves manipulating the actionbar will not change the white bar's status. **
EDIT: XML Code is 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:background="#drawable/bucket"
android:theme="#+id/BucketTheme2"
android:backgroundTint="#70FFFFFF"
android:backgroundTintMode="src_over">
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableRow>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:paddingBottom="5dp"
android:paddingTop="100dp"
android:text="Find a place to go around you!"
android:textColor="#ff000000"
android:textSize="18dp" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:onClick="randomButtonPressed"
android:text="RANDOMIZE"
android:textSize="20dp" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/bucketBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:onClick="bucketButtonPressed"
android:text="Bucket List"
android:textSize="20dp" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/searchLocationBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:onClick="searchButtonPressed"
android:text="Search by Location"
android:textSize="20dp" />
</TableRow>
</TableLayout>
</RelativeLayout>
EDIT 2: style.xml code for BucketTheme2 is below (I did not post it initially because it only sets colors):
<style name="BucketTheme2" parent="android:Theme.Holo.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>

Set theme for application or activity in Manifest.xml to remove action bar:
android:theme="#android:style/Theme.Holo.Light.NoActionBar"
Or add the following code in Activity in the onCreate method and import android.support.v7.app.ActionBar:
ActionBar actionBar = getSupportActionBar();
actionBar.hide();

Add the following theme to the style.xml
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
Then set this theme to the activity in manifest:
<activity
android:name=".MainActivity"
android:theme="#style/AppTheme.NoActionBar"/>
UPDATE: You can also set the theme as below:
<style name="BucketTheme2" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
Hope this helps.

Change your activity theme in manifest to Theme.AppCompat.Light.NoActionBar and you should be sorted

Add NoActionBar style in style.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="android:windowFullscreen">false</item>
<item name="android:windowContentOverlay">#null</item>
</style>
And add this theme to your activity from manifest,
<activity android:name=".YourActivity"
android:theme="#style/AppTheme"
>
</activity>

try
requestWindowFeature(Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.main);
it should be before setContentView

Just try this in your style
<style name="BucketTheme2" parent="android:Theme.Holo.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>

I ran into this same issue when using a template project that Android studio already set up. I noticed that in the activity_main.xml file there was unnecessary padding at the top once I changed to a theme of *.NoActionBar. If you remove android:paddingTop="?attr/actionBarSize" it should go away.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="?attr/actionBarSize"></androidx.constraintlayout.widget.ConstraintLayout>

Related

ConstraintLayout TextView is not shown

I got the following problem in my ConstraintLayout
Layout File:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?android:attr/actionBarSize"
android:orientation="horizontal"
android:paddingEnd="8dp">
<android.support.constraint.ConstraintLayout
android:id="#+id/layout_titlemode"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView_title"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="32dp"
android:layout_marginRight="32dp"
android:layout_marginTop="8dp"
android:text="TextView"
android:textAlignment="center"
android:textColor="#color/colorUnactive"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.5"/>
</android.support.constraint.ConstraintLayout>
</LinearLayout>
Styles (using AppTheme):
<resources>
<style name="AppTheme" parent="Theme.MultiBackStack">
<item name="android:textColorPrimary">#color/colorTextPrimary</item>
</style>
<style name="Theme.MultiBackStack" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimary</item>
<item name="android:textColorPrimary">#color/colorTextPrimary</item>
</style>
</resources>
This is what I expected due to preview:
I excepted that the TextView would take all the available space (like match_parent) and that the text is shown in the center of the view.
This is what is actually shown:
Instead, nothing is shown actually (I guess because of the layout_width="0dp")
The newest version of the constraint support library is added:
'com.android.support.constraint:constraint-layout:1.0.2'
What I tried in addition:
I added to the TextView app:layout_constraintWidth_default="wrap"
This let the TextView shown up, but it starts on the left and is not centered. How can I achieve to center the view ?
I can't determine why nothing is shown.
Thank you in advance for your helping!
try using theme.
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="colorPrimaryDark">#color/colorPrimaryD</item>
</style>
Try using this theme in style.xml file
<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">

Top bar for app not hiding android

I have an app and in the Login screen I have multiple ways to login like gmail, facebook and manual login. They all are working nicely but the problem arises when I try to hide the top bar which shows the app name. I know this has something to do with the theme in the manifest but I haven't set any. Please have a look at my code and see what I am doing wrong ...
Manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.example.spuck"
android:versionCode="1"
android:versionName="1.0">
<uses-sdk
android:minSdkVersion="16"
android:targetSdkVersion="23" />
<application
android:allowBackup="true"
android:icon="#drawable/the_spuck_4"
android:label="#string/app_name"
android:theme="#style/AppTheme">
<activity android:name=".LoginActivity"/>
LoginActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:facebook="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.spuck.LoginActivity"
style="#style/Red">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginBottom="94dp">
<Button
android:id="#+id/sign_in"
android:layout_width="260dp"
android:layout_height="35dp"
android:textSize="13dp"
android:text="Sign In"
android:textColor="#color/white"
android:textAllCaps="false"
android:background="#drawable/signin_button_login_activity"
android:gravity="center"
android:layout_below="#+id/login_button"
android:layout_alignLeft="#+id/sign_in_button"
android:layout_alignStart="#+id/sign_in_button"
android:layout_marginTop="33dp" />
<ImageView
android:id="#+id/app_name"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#drawable/the_spuck_3_2"
android:background="#drawable/white_with_round"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp" />
<com.google.android.gms.common.SignInButton
android:id="#+id/sign_in_button"
android:layout_width="260dp"
android:layout_height="35dp"
android:layout_marginTop="41dp"
android:layout_below="#+id/app_name"
android:layout_centerHorizontal="true" />
<com.facebook.login.widget.LoginButton
android:id="#+id/login_button"
android:layout_width="255dp"
android:layout_height="60dp"
android:textColor="#ffffff"
android:layout_marginTop="10dp"
android:shadowColor="#000"
android:shadowDx="0"
android:shadowDy="0"
android:shadowRadius="10"
android:layout_below="#+id/sign_in_button"
android:layout_centerHorizontal="true" />
</RelativeLayout>
</RelativeLayout>
AppTheme.NoActionBar.xml
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="colorPrimary">#ff5050</item>
<item name="colorPrimaryDark">#ff5050</item>
</style>
Change the theme of the activity to NoActionBar :
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="colorPrimary">#ff5050</item>
<item name="colorPrimaryDark">#ff5050</item>
</style>
As Nika said, his approach is absolutely correct. What you need to see is that there are 2 types of themes made. One for API 21 and above and the other for API 21 and below. What you need to do is to assign the theme he said to both versions since you want your app to work for both API conditions. See the code below and let me know if it helped ...
for API 21 and above:
<resources>
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#ff5050</item>
<item name="colorPrimary">#ff5050</item>
<item name="colorPrimaryDark">#ff5050</item>
</style>
</resources>
for API 21 and below:
<style name="AppTheme.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="colorPrimary">#ff5050</item>
<item name="colorPrimaryDark">#ff5050</item>
</style>
Now to access this you need to change your manifest to this:
<activity android:name=".LoginActivity"
android:theme="#style/AppTheme.NoActionBar"/>
P.S if you are not sure on how to see the themes for their respective API hold the ctrl button and click on "AppTheme.NoActionBar" text, it will show you two fields where they are to be found and just edit both of them.

Android change color of home arrow in android.support.v7.widget.Toolbar

I am trying to change color of home arrow indicator in custom toolbar.
There is list of examples that I found but nothing worked for me.
Here is my layout
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/title_bar_toolbar_id"
app:theme="#style/ToolbarColoredBackArrow"
app:popupTheme="#style/AppTheme"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
android:colorControlNormal="#color/hamburger_color"
android:background="#color/custom_theme_color" >
<LinearLayout
android:id="#+id/base_title_bar_toolbar_id_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
android:id="#+id/activity_calendar_toolbar_change_view_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/select_semester_view"
android:layout_gravity="center_vertical"
android:padding="10dp" />
<TextView
android:gravity="center"
android:layout_gravity="center"
android:id="#+id/base_title_bar_toolbar_header"
android:layout_weight="0.1"
style="#style/CustomToolBarTitleStyleBase"
android:text="#string/calendar" />
<ImageView
android:padding="13dp"
android:id="#+id/activity_calendar_toolbar_save_date_to_calendar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/save_date_to_calendar"
android:layout_gravity="center_vertical|start" />
<ImageView
android:id="#+id/activity_calendar_toolbar_select_semester_to_show"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/select_semester_to_show"
android:layout_gravity="center_vertical|start"
android:padding="13dp" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
The styles are:
<style name="ToolbarColoredBackArrow" parent="AppTheme">
<item name="android:textColorSecondary">#color/hamburger_color</item>
<item name="android:textColorPrimary">#color/hamburger_color</item>
<item name="colorControlNormal">#color/hamburger_color</item>
</style>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="android:actionBarTabTextStyle">#style/MyActionBarTabText</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="actionBarTabTextStyle">#style/MyActionBarTabText</item>
</style>
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/custom_theme_color</item>
<item name="android:titleTextStyle">#style/MyActionBar.TitleTextStyle</item>
<!-- Support library com`enter code here`patibility -->
<item name="background">#color/custom_theme_color</item>
<item name="titleTextStyle">#style/MyActionBar.TitleTextStyle</item>
</style>
I tried all possibilities that I found in examples,
but nothing worked for me.
Haha, this is one of the most frustrating styling issues in Android right now...
Try creating a style like this
<style name="AppThemeNoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:textColorSecondary">#000000</item>
</style>
and using it in your Activity (you will probably want to merge it with your current style, as it is just the parent and this one param that matters) and of course replace the #000000 with some other color.
First of all you don't need a separate ImageView for your arrow navigation button. Just use the one from support design resources which will resize automatically according to the screen size.
Drawable upArrow = getResources().getDrawable(android.support.v7.appcompat.R.drawable.abc_ic_ab_back_mtrl_am_alpha);
upArrow.setColorFilter(Color.parseColor("#ffffff"), PorterDuff.Mode.SRC_ATOP);
toolbar.setNavigationIcon(upArrow);

How to bring ImageView under the transparent Status Bar

In the images below,I am trying to bring the ImageView under the StatusBar. But its not happening.
Image Screenshot on Android API 19
Image Screenshot on Android API 22
I went on Android transparent status bar and actionbar (this question) and tried to implement the same but its not working.
The xml layout of the activity is
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
android:id="#+id/category_layout_top"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:fitsSystemWindows="true"
android:layout_width="390dp"
android:layout_height="390dp"
android:id="#+id/category_Image_View"/>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/def_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="#00FFFFFF"
android:layout_alignParentTop="true" />
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/category_linearlayout">
<TextView android:layout_width="match_parent"
android:layout_height="match_parent"
android:singleLine="true"
android:id="#+id/category_textView"
/>
</LinearLayout>
</LinearLayout>
</FrameLayout>
I tried the below code in the onCreate() method also
setStatusBarTranslucent(true);
protected void setStatusBarTranslucent(boolean makeTranslucent) {
if (makeTranslucent) {
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
} else {
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
}
}
style.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
style-v21.xml
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
AppTheme is the style used in the activity.
EDIT 1
I used a color in the background of FrameLayout to check whether it was under the status bar or not. And it is not.
So the problem is not with Layout, I guess.
EDIT 2
this is the desired result
In style-v21 you are overriding the style AppTheme.NoActionBar, but you said the style you use in your activity is the AppTheme style.
You need to override the AppTheme layout in style-v21 or define AppTheme.NoActionBar in you activity.

Theme Style don't work on custom LiestView Items

I want to build a theme for my app. But it seems like my LiestView item don't apply the values.
This is the styles.xml:
<style name="AppTheme" parent="android:Theme.Holo.Light">
<item name="android:textViewStyle">#style/TextView</item>
</style>
<style name="TextView" parent="android:Widget.TextView">
<item name="android:layout_margin">8dp</item>
<item name="android:padding">0dp</item>
<item name="android:textColor">#87000000</item>
<item name="android:textSize">18sp</item>
</style>
in my activity i use a Listview with Custom Adapter but the TextViews from my item.xml did'nt have a margin:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:orientation="vertical"
tools:context="de.resper.enigma2chromecast.mainLive" >
<TextView
android:id="#+id/channelName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:text="#string/hello_world" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/hello_world"
android:id="#+id/channelLine1"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray" />
</LinearLayout>
what ever you designed xml, put in android manifest file in application theme
<application android:theme="#style/CustomTheme">

Categories

Resources