We Keep Coding

TextView does not auto-size despite setting it to uniform

I'm trying to work with TextView's default auto sizing functionality but it doesn't work. I want my TextViews' texts to decrease in size if they move onto the next line and despite setting android:autoSizeStepGranularity="15dp", I barely see any difference. The 2 TextViews are on top of an ImageView
This is my 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".TopImageFragment">
<ImageView
android:id="#+id/meme_image_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/click"
android:scaleType="fitXY"
android:tag="img1"
/>
<TextView
android:id="#+id/top_text_view"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_alignTop="#id/meme_image_view"
android:layout_centerHorizontal="true"
android:autoSizeTextType="uniform"
android:autoSizeStepGranularity="15dp"
android:shadowColor="#000"
android:shadowDx="2"
android:shadowDy="2"
android:shadowRadius="2"
android:textAllCaps="true"
android:textColor="#android:color/white"
android:textAlignment="center"
android:fontFamily="#font/impact"
android:gravity="center"
android:textSize="50sp" />
<TextView
android:id="#+id/bottom_text_view"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/meme_image_view"
android:layout_centerHorizontal="true"
android:autoSizeTextType="uniform"
android:autoSizeStepGranularity="15dp"
android:shadowColor="#000"
android:shadowDx="1.5"
android:shadowDy="1.3"
android:shadowRadius="1.6"
android:textAllCaps="true"
android:textColor="#android:color/white"
android:textAlignment="center"
android:fontFamily="#font/impact"
android:gravity="center"
android:textSize="50sp" />
</RelativeLayout>
And here is an example of what I'm talking about:

Your text views have height set to wrap_content. They will grow automatically to accommodate all the text before changing text size.
Pick one of these depending on your use case (with your own values, of course):
android:layout_height="100dp"
or
android:layout_height="wrap_content"
android:maxHeight="100dp"

how to get a portion of a view outside of its parent?

I tried to create an actionBar like this one, "this is a website template "
so I created a file action_bar.xml which I'll inflate, A RelativeLayout which has a height of wrap_content & a width of match_parent , it has the gear icon and all other details except that I can't get a part of the round picture outside of the RelativeLayout like the picture.
I tried using margins but it doesn't get out of the RelativeLayout, The RelativeLayout gets extended instead. so, More margin in the picture results in more height in RelativeLayout.
Any suggestions?
<?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="wrap_content">
<ImageButton android:src="#drawable/roundPicture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="30sp"
android:layout_marginLeft="30sp"
android:padding="0sp"/>
<ImageButton
android:id="#+id/gearIcon"
android:layout_alignParentRight="true"
android:background="#drawable/gearICON"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10sp"
/>
</RelativeLayout>
No Libraries please, I'm not making an app, I'm just trying to understand.
quick recap. I want a part of the first ImageButton outside of the RelativeLayout

Check if it is this what you are looking for
EDIT:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff">
<ImageButton
android:id="#+id/gearIcon"
android:layout_alignParentRight="true"
android:background="#android:drawable/ic_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10sp"
/>
</RelativeLayout>
<ImageButton
android:background="#android:drawable/ic_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="30sp"
android:layout_marginLeft="30sp"
android:padding="0sp"/>
</FrameLayout>

First, I ran into a problem that my data appears under the ImageView, not behind it
but I fixed it by adding my data which is a listview, after the relativeLayout in the frameLayout, Thanks P.Juni for the idea btw
The XML which runs totally fine is
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#000">
<ImageButton
android:id="#+id/gearIcon"
android:layout_alignParentRight="true"
android:background="#drawable/ic_launcher_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10sp"
/>
</RelativeLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
<ImageButton android:id="#+id/imageButton"
android:background="#drawable/ic_launcher_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="60sp"
android:layout_marginLeft="30sp"
android:padding="0sp"/>
</FrameLayout>

Android: Custom Listview item - force on one line

I have a custom cell for my listview which has TEXT NUMBER - which works fine, however when the TEXT goes over one line, the right hand number goes over more than one line too which looks silly. Is there a property to fix this from happening?
My XML is:
<?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="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/txtOption"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="7"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/txtCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="3"
android:paddingBottom="5dp"
android:paddingLeft="25dp"
android:paddingRight="15dp"
android:paddingTop="5dp"
android:text="[21]"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>

Seems like your layout_weight for views is not kicking-in. For that, I think you are missing to define android:weightSum="10" within your LinearLayout definition. Moreover, you need to set android:layout_width="0dp" to both of your TextView.

View not showing properly in android layout

I am designing custom dialogue in android, For this purpose I designed xml file as
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:background="#color/item_bg_color"
android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal">
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/custom_dialog_text"
android:textColor="#000000"
android:textSize="14dip"
android:typeface="serif"
android:singleLine="false"
android:text="You are not authorized to use this application."
android:layout_marginTop="10dip"/>
<Button android:id="#+id/custom_button_ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ok"
android:layout_below="#+id/custom_dialog_text"
android:layout_toRightOf="#+id/custom_dialog_text"/>
</RelativeLayout>
Problem :
I want to show button at end (Right) of TextView, And textview's text should be in more than one line(if more characters have to show). But when I am using this layout, button is not appearing anywhere.
I used LinearLayout and TableLayout also and in both cases, button is appearing with a little part. Where am I wrong?

Basically you want to tell the button to be align to the right, take all the space it needs, then give the rest of the space to the TextView. You do this by specifying android:layout_layout_alignParentRight="true" for the button and android:layout_toLeftOf="#id/custom_button_ok" for the TextView. Mind the order!!!
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:background="#color/item_bg_color" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal">
<Button android:id="#+id/custom_button_ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ok"
android:layout_layout_alignParentRight="true" />
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/custom_dialog_text"
android:textColor="#000000"
android:textSize="14dip"
android:typeface="serif"
android:singleLine="false"
android:text="You are not authorized to use this application."
android:layout_marginTop="10dip"
android:layout_toLeftOf="#id/custom_button_ok"
/>
</RelativeLayout>

For Button add the attributes android:layout_alignParentRight,android:layout_below,they help you

try doin this..
<TextView android:layout_width="100dip"
android:layout_height="wrap_content"
android:id="#+id/custom_dialog_text"
android:textColor="#000000"
android:textSize="14dip"
android:typeface="serif"
android:singleLine="false"
android:text="You are not authorized to use this application."
android:layout_marginTop="10dip"/>

layout_belw and layout_rightof properties are set to same Id in text view.Just use layout_below.Also u can set gravity of button to bottom

Please try below code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:orientation="horizontal" android:weightSum="1.0">
<RelativeLayout android:layout_height="wrap_content"
android:layout_width="0dp" android:layout_weight="0.85">
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content" android:id="#+id/custom_dialog_text"
android:textColor="#FFFFFF" android:textSize="14dip"
android:typeface="serif" android:singleLine="false"
android:text="You are not authorized to use zdsaddsad this application."
android:layout_marginTop="10dip" />
</RelativeLayout>
<RelativeLayout android:layout_height="wrap_content"
android:layout_width="0dp" android:layout_weight="0.15">
<Button android:id="#+id/custom_button_ok"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="Ok" />
</RelativeLayout>
</LinearLayout>

Android Wear: Layout is not displaying properly in Emulator

I'm developing an Android smart watch application. The initial screen appears fine. But, when I go to next screen, the upper part pops up with the name of project something like this. In the below image, Watch is the name of the project.
I want to see the entire screen instead of white space which contains project's name. Does anyone know how to solve it and why is it appearing?
My XML file is
<?xml version="1.0" encoding="utf-8"?>
<android.support.wear.widget.BoxInsetLayout 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"
android:orientation="vertical"
tools:deviceIds="wear">
<LinearLayout
android:id="#+id/mainContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black"
android:weightSum="1"
tools:ignore="UselessParent"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true">
<LinearLayout
android:id="#+id/sign_up_top_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:layout_marginTop="15dp">
<TextView
android:id="#+id/textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="5dp"
android:textAlignment="center"
android:textSize="18sp"
android:text="#string/text"
android:background="#color/black"
android:textColor="#color/white"
android:fontFamily="Century-Gothic.ttf" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="18dp"
android:layout_height="19dp"
android:layout_toRightOf="#+id/text"
android:src="#drawable/fingerprint" />
</LinearLayout>
<Button
android:layout_marginTop="10dp"
android:id="#+id/button"
android:background ="#drawable/roundedbutton"
android:text="#string/button_text"
android:layout_width="108dp"
android:textAlignment="center"
android:drawablePadding="20dp"
android:layout_gravity="center"
android:textColor="#color/white"
android:layout_height="75dp"
android:layout_weight="0.34" />
</LinearLayout>
</android.support.wear.widget.BoxInsetLayout>

Use a BoxInsetLayout for your root layout:
This class applies the required window insets depending on the screen
shape and lets you easily align views on the center or near the edges
of the screen.
And I would highly recommend you to read through this tutorial.
Edit 2:
You need to use:
android.support.wearable.view.BoxInsetLayout
not:
android.support.wear.widget.BoxInsetLayout
and add to the mainContainer:
app:layout_box="all"
<android.support.wearable.view.BoxInsetLayout
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"
android:orientation="vertical"
tools:deviceIds="wear">
<LinearLayout
app:layout_box="all"
android:id="#+id/mainContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#color/black"
android:weightSum="1"
tools:ignore="UselessParent"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true">

The answer to the question was simple. I figured out after one day. I changed my theme from Theme.AppCompat.Light to Theme.AppCompat.Light.NoActionBar in Manifest file. The program name bar disappeared.