Android Toolbar TextView match_parent getting bigger than screen - android

I have a Toolbar with a TextView inside with match_parent to center the text but every time I do so it gets bigger than the screen and hides the text.
Here you have a capture of it running
How this looks like in the preview
And finally how I implement it:
<?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="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout_editor_absoluteY="0dp"
tools:layout_editor_absoluteX="8dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:theme="#style/ToolBarStyle" >
<TextView
android:id="#+id/toolbar_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="#string/title_activity_anuncios" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.constraint.ConstraintLayout>
</LinearLayout>

check your theme on style or set activity theme from the manifest
android:theme="#android:style/Theme.Translucent.NoTitleBar"
If activity theme is correct then you can check your activity >> onCreate method.
ActionBar actionBar = getSupportActionBar();
if (actionBar != null) {
actionBar.setTitle("Your Title");
}

Put this in your toolbar
app:contentInsetStart="0dp"

Related

CollapsingToolbarLayout hides my back button

I created collapsing tool bar, but it seems I can't inflate the back button, or other menu items.
I inflate my back button like this:
toolbar_detail = findViewById(R.id.tool_de);
setSupportActionBar(toolbar_detail);
if (toolbar_detail != null) {
Objects.requireNonNull(getSupportActionBar()).setDisplayHomeAsUpEnabled(true);}
And this is my collapsing app bar layout:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:fitsSystemWindows="true"
tools:context=".Detail">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:id="#+id/app_bar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/coolaps_tool_bar"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#color/colorPrimary">
<ImageView
android:layout_width="match_parent"
android:layout_height="250dp"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
android:src="#drawable/ic_launcher_background"
android:contentDescription="zx" />
<androidx.appcompat.widget.Toolbar
android:id="#+id/tool_de"
android:layout_width="0dp"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:elevation="4dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:titleTextColor="#android:color/white" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="sdsaa"
/>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
How can I fix this problem?
I tried several approachs like specify parent activity etc doesn't seem to be working
0dp makes no sense in your <Toolbar> so make it match_parent
Add your icon with one of these ways:
Add back button on Toolbar directly:
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:navigationIcon="#drawable/my_back_button_icon"/>
If you want to use your default ActionBar back button:
getSupportActionBar()).setDisplayHomeAsUpEnabled(true);
Be sure to set a parent inside your AndroidManifest:
<activity android:name=".SecondActivity" android:parentActivityName=".MainActivity">

Adding a border below Toolbar android

I'm trying to add a border that would look like this:
https://imgur.com/a/r8rHGQl
My toolbar.xml:
<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/toolbar_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:elevation="1dp"
app:theme="#style/AppTheme"
app:titleTextAppearance="#style/TitleText"
app:titleTextColor="#color/colorPrimaryText"
>
</android.support.v7.widget.Toolbar>
In my java code I do :
toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
and inflating the menu.
If I try to nest the toolbar in relative/linear/constrains layout and add a View at the bottom I get the "android.widget.LinearLayout cannot be cast to android.support.v7.widget.Toolbar" error
Also tried to <include a layout with a View inside of it, but then the line appears in the middle of my toolbar and my title disappears.
Also including my menu.xml:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="#+id/item1"
android:icon="#drawable/main_btn_info"
android:title="Item 1"
app:showAsAction="always"/>
</menu>
Create toolbar inside Linear Layout with a view
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:elevation="1dp"
app:theme="#style/AppTheme"
app:titleTextAppearance="#style/TitleText"
app:titleTextColor="#color/colorPrimaryText"/>
<View
android:background="your border color"
android:layout_width="match_parent"
android:layout_height="2dp" />
</LinearLayout>
Include this in all your layouts.
Then find toolbar in activity using toolbar id instead of xml name
toolbar = findViewById(R.id.toolbar_main);
setSupportActionBar(toolbar);
I used this method:
<LinearLayout 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:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:title="Setting"
app:titleTextColor="#color/colorPrimary" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginTop="1dp"
android:layout_marginBottom="1dp"
android:background="#DDD" />
</LinearLayout>
Made another layout with the border and included it in every activity, I know it's not the best way to do it, but result is the same for now.
Try using the elevation parameter
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF"
app:title="Log In"
android:elevation="5dp"
app:titleTextColor="#000000" />
android:elevation="5dp"
This gives you out an basic elevation border bottom shadow for Toolbar

AppBarLayout elevation hides toolbar

I'm trying to disable the shadow below a transparent AppBarLayout/Toolbar. Here's the layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#000">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:background="#android:color/transparent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/imagePreviewToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_image_preview" />
</android.support.design.widget.CoordinatorLayout>
I already tried with
app:elevation="0dp"
and
getSupportActionBar().setElevation(0);
but that makes the UP arrow invisible. I also tried to remove the AppBarLayout and use only the Toolbar, but the problem persists.
Anyone has a solution?
EDIT:
Replacing the AppBarLayout + Toolbar combo with this code:
<android.support.v7.widget.Toolbar
android:id="#+id/imagePreviewToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:elevation="0dp"/>
partially fixed the problem. Now the Toolbar becomes invisible only when the device is in landscape mode! The Android Studio Layout Editor shows me the Toolbar in both orientations just fine, so I don't really know what the problem could be..
after some tries i did find that ToolBar should be the last view in this case else if it will be first then the view coming after it will overlap it as it has height set to match_parent so try this way in layout.
Layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/imagePreviewToolbar" >
<ImageView
android:id="#+id/image_preview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/galacticos"
android:contentDescription="abc"
android:scaleType="fitCenter" />
<LinearLayout
android:id="#+id/actionBtns"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:padding="16dp" >
<ImageButton
android:id="#+id/setBackgroundBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#null"
android:contentDescription="abc"
android:src="#drawable/ic_launcher" />
<ImageButton
android:id="#+id/downloadBtn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="?selectableItemBackgroundBorderless"
android:clickable="true"
android:contentDescription="abc"
android:src="#drawable/ic_launcher" />
</LinearLayout>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/imagePreviewToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:fitsSystemWindows="true"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
And don't forget to initialize this all and set your title to false to only show the toolBar back button:
Activity Code
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.test);
Toolbar mToolBar = (Toolbar) findViewById(R.id.imagePreviewToolbar);
setSupportActionBar(mToolBar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowTitleEnabled(false);
getSupportActionBar().setHomeButtonEnabled(true);
}
Pics
Hope i helped you.
Make toolbar like this:
<android.support.design.widget.AppBarLayout
android:id="#+id/myAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"...>
</android.support.design.widget.AppBarLayout>
And after that in your Activity;
findViewById(R.id.myAppBar).bringToFront();

When add a custom view in Android Toolbar, there will be a marginLeft

I have some problems about android toolbar. Normally if I set a custom view into toolbar, the view should fill the whole toolbar space from left to right and has no margin.
but mine has a empty space in the left , these are my code :
xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/base_toolbar"
android:layout_width="match_parent"
android:layout_height="46dip"
android:background="?attr/colorPrimary" />
<FrameLayout
android:id="#+id/base_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
activity:
private void initToolbar() {
toolbar = (Toolbar) findViewById(R.id.base_toolbar);
setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
if( actionBar != null)
actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM);
contentLayout = (FrameLayout) findViewById(R.id.base_content);
}
Is here anything wrong with my code or it should be like this ?
The space on the left is caused by Toolbar's contentInsetStart which by default is 16dp. You can set it to 0 to remove it. Dont forget to add the schema.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/base_toolbar"
android:layout_width="match_parent"
android:layout_height="46dip"
android:background="?attr/colorPrimary"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp" />
<FrameLayout
android:id="#+id/base_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
You can do like this,
<android.support.v7.widget.Toolbar
android:id="#+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#1E90FF"
android:minHeight="?attr/actionBarSize" >
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:ellipsize="end"
android:singleLine="true"
android:text="Toolbar Title"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#ffffff" />
</android.support.v7.widget.Toolbar>

How to set ActionBar for transaparent and keep it over ImageView

I want to make the ActionBar transparent and it above the image like this picture.
How set it?
Layout
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/background_white"
android:minHeight="?attr/actionBarSize" />
<FrameLayout
android:id="#+id/framelayout_content"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
Solution 1#
//whole toolbar will be transparent
mToolbar.setAlpha(0.0f);
Solution 2#
//only background of toolbar will be transparent
mToolbar.getBackground().setAlpha(0);
#maros136:
I think you should add the toolbar layout below the framelayout_content and the root layout should be a RelativeLayout in order to have the toolbar always on top.
Like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_details_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
Your layout here
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/transparent"
/>
</RelativeLayout>
Result:
https://play.google.com/store/apps/details?id=com.levionsoftware.photos

Categories

Resources