Customise Textview of included layout - android

I have a layout as follows:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ImageView
android:id="#+id/logo_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/logos_background">
</ImageView>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginBottom="5dp"
android:layout_alignBottom="#+id/logo_background"
>
<TextView
android:id="#+id/logoDetails"
android:text="Test Logo details"
android:textSize="15sp"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:id="#+id/stockQuantity"
android:layout_centerHorizontal="true"
android:textSize="20sp"
android:layout_below="#+id/logoDetails"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="x10"/>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
I need to include this layout multiple times in another layout which I have done as follows:
<HorizontalScrollView
android:layout_below = "#+id/selectLayout"
android:id="#+id/pager"
android:scrollbars="none"
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_marginTop="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<include layout="#layout/viewpager_item_layout"/>
<include layout="#layout/viewpager_item_layout"/>
<include layout="#layout/viewpager_item_layout"/>
<include layout="#layout/viewpager_item_layout"/>
<include layout="#layout/viewpager_item_layout"/>
<include layout="#layout/viewpager_item_layout"/>
<include layout="#layout/viewpager_item_layout"/>
</LinearLayout>
</HorizontalScrollView>
This gives the the following result:
The problem is I need to access the text views and image views in each <include>. So the logo image will be different the test logo details will be different and the 'x10' will be different for each one as I hope to populate them from a database. Could anyone shine a light on this?
It had been my intention to use a view pager for this but that doesn't work as it takes up the whole width and height of the screen.

<include android:id="#+id/news_title"
layout="#layout/viewpager_item_layout"/>
Try if it helps.
You can access like this :
View includedLayout = findViewById(R.id.news_title);
TextView insideTheIncludedLayout = (TextView )includedLayout.findViewById(R.id.logoDetails);

after setting layout to include tags , in your code use this :
View v = findViewById(R.id.your_layout_id);
TextView tv = (TextView) v.findViewById(R.id.text_view_id);

Related

Linear Layout overlapping with Scroll view and other Linear Layout

Recently i have encounterd a problem. My linear layout where my edit text and image button is in is overlapping with my toolbar and my scroll view. I've tried other things like layout_below etc and nothing worked. Groupchat.xml
<RelativeLayout
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"
tools:context=".GroupChatActivity"
android:orientation="vertical">
<include
android:id="#+id/group_chat_bar_layout"
layout="#layout/app_bar_layout">
</include>
<ScrollView
android:id="#+id/my_scroll_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/group_chat_bar_layout"
android:layout_above="#+id/myLinearLayout">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/group_chat_text_display"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:textAllCaps="false"
android:textSize="20sp"
android:textColor="#android:color/background_dark"
android:layout_marginStart="2dp"
android:layout_marginEnd="2dp"
android:layout_marginBottom="50dp"/>
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/myLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:id="#+id/input_group_message"
android:layout_width="270dp"
android:layout_height="wrap_content"
android:hint="Write message..." />
<ImageButton
android:id="#+id/send_message_button"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:src="#drawable/send_message" />
</LinearLayout>
This is how the preview of the groupchat.xml file looks in Android Studio:
enter image description here
This was how the app looked with this code.
This are the results
Just in case, this is the code of my toolbar: Appbarlayout.xml
<android.support.v7.widget.Toolbar
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/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
It in a seperate xml because i'm using it for other activities in my app to thats why theres ang include in th Groupchat.xml
ALSO I AM FOLLOWING THIS TUTORILA. I suggest you go ther and see it because that is what i followed.
go to this video
Thank you.
The problem is with layout placements. your LinearLayout with ID: myLinearLayout is not aligned anywhere in RelativeLayout that's why it is getting rendered on top of the screen. make following changes and your good to go.
in your LinearLayout with id: myLinearLayout, add this line:
android:layout_alignParentBottom="true"
like this:
<LinearLayout
android:id="#+id/myLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
Add
android:layout_below="#+id/group_chat_bar_layout"
this line to LinearLayout
<LinearLayout
android:id="#+id/myLinearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/group_chat_bar_layout"
android:orientation="horizontal">
<EditText
android:id="#+id/input_group_message"
android:layout_width="270dp"
android:layout_height="wrap_content"
android:hint="Write message..." />
<ImageButton
android:id="#+id/send_message_button"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:src="#drawable/bkg" />
</LinearLayout>`

How can I Embed text inside image?

I want to display a custom text (mainly person info) inside an image like it's shown above. How can I do it in android? For example, I have a known size of this image (it differs from device to device) and want to display it with the different text size inside it in the special place.
You can use, for example, RelativeLayout.
Make your ImageView be match_parent and use some container for your text lines in bottom of parent RelativeLayout.
Example:
<?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">
<ImageView
android:scaleType="fitXY"
app:srcCompat="#drawable/ic_launcher_background"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:padding="20dp"
android:background="#92fffaaa"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="200dp">
<TextView
android:textSize="20sp"
android:text="Some test text"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>
Result:
Try this (adjust dimensions as your requirement)
<RelativeLayout
android:layout_width="200dp"
android:layout_height="150dp">
<ImageView
android:scaleType="centerCrop"
android:src="#drawable/your_image"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:background="#64000000"
android:padding="8dp"
android:gravity="center_vertical"
android:orientation="vertical"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="Title"
android:textColor="#ffffff"
android:textSize="16sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:text="Sub Title"
android:textColor="#ffffff"
android:textSize="14sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
I've done something similar previously.
Use Framelayout.
Add ImageView in frame layout with match_parent constraints.
Add LinearLayout having background="#80000000" and layout_gravity="center" in FrameLayout which contains your two TextViews.
Let me know in case this does not work.

Set font type in duplicate layout

I have layount who include one layout, duplicate two time ("include"):
<?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="#color/colorButtonNiebieski">
<!-- LAYOUT GRACZ (A) -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.45"
android:scaleY="-1"
android:scaleX="-1"
android:paddingBottom="10dp">
<include
android:id="#+id/lay1"
layout="#layout/layout_pojedynek_duplikat" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.05"
android:gravity="center"
android:scaleY="-1"
android:scaleX="-1">
<TextView
android:id="#+id/txt_gracz_A_liczba_punktow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2"
android:textSize="30dp"
android:textColor="#color/colorWhite"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.05"
android:gravity="center">
<TextView
android:id="#+id/txt_gracz_B_liczba_punktow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="7"
android:textSize="30dp"
android:textColor="#color/colorWhite"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.45"
android:paddingBottom="10dp">
<include
android:id="#+id/lay2"
layout="#layout/layout_pojedynek_duplikat" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
layout_pojedynek_duplikat.xml
<?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:weightSum="1.0">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0"
android:weightSum="1.0"
android:background="#00ff0000"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.3"
android:gravity="center">
<TextView
android:id="#+id/txt_gracz_A_i_B_nazwa"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="POLSKA"
android:textSize="40dp"
android:textColor="#color/colorWhite"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.7"
android:gravity="center">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="1.0">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0"
android:layout_weight="0.5"
android:orientation="horizontal">
<ImageView
android:id="#+id/img_pojedynek_wariant_A"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/argentyna"
android:padding="5dp"
android:adjustViewBounds="true"/>
<ImageView
android:id="#+id/img_pojedynek_wariant_B"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/kambodza"
android:padding="5dp"
android:adjustViewBounds="true"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1.0"
android:layout_weight="0.5"
android:orientation="horizontal">
<ImageView
android:id="#+id/img_pojedynek_wariant_C"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/watykan"
android:padding="5dp"
android:adjustViewBounds="true"/>
<ImageView
android:id="#+id/img_pojedynek_wariant_D"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:src="#drawable/polska"
android:padding="5dp"
android:adjustViewBounds="true"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
In java file I try set font for txt_gracz_A_i_B_nazwa text field:
TextView txt_gracz_A_i_B_nazwa = (TextView) findViewById(R.id.txt_gracz_A_i_B_nazwa);
txt_gracz_A_i_B_nazwa.setTypeface(myFontBold);
But this set font for only one view:
How can I fix this problem?
DO that for every view. Or create a new View class that's a child of TextView and sets the font, and use that instead of TextView.
Yes, Android's font handling sucks.
When you call Activity.findViewById(), the system will traverse your view hierarchy starting from the root until it finds a view with the given id. In other words, Activity.findViewById() will return the first view with that id in your layout. It will not return all views with that id.
For this reason, it is generally advised to not re-use ids within a single layout. However, this advice is often not practical, and you shouldn't feel bad about your current layout. But it does mean that you will need to call TextView.setTypeface() twice, and that you will need some way to access the second view with the id txt_gracz_A_i_B_nazwa.
You can do this by limiting the scope you search with findViewById(). Instead of using Activity.findViewById(), instead use View.findViewById(). So you could write something like this:
View lay1 = findViewById(R.id.lay1);
TextView txt1 = (TextView) lay1.findViewById(R.id.txt_gracz_A_i_B_nazwa);
txt1.setTypeface(myFontBold);
View lay2 = findViewById(R.id.lay2);
TextView txt2 = (TextView) lay2.findViewById(R.id.txt_gracz_A_i_B_nazwa);
txt2.setTypeface(myFontBold);
Looks like a small logic flaw. The problem with reusing the same layout two times, is that you have the identical IDs although they represent two entirely different UI elements.
lay1.findViewById(your_text_field_id).setFontType
lay2.findViewById(your_text_field_id).setFontType
Should fix you. You can't use generic findViewById as it will grab the first one and use it. Hope that helps.

How to display the FAB in all activities

In my activity_navigation.xml I put my FAB here.
The is below:
<android.support.v4.widget.DrawerLayout
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"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/content_frame">
<com.github.clans.fab.FloatingActionMenu
android:id="#+id/menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:menu_icon="#drawable/quick_apply"
android:layout_gravity="bottom|right"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp">
<com.github.clans.fab.FloatingActionButton
android:id="#+id/view_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/imgicon"
fab:fab_size="mini"
fab:fab_label="View Images" />
<com.github.clans.fab.FloatingActionButton
android:id="#+id/camera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/camicon"
fab:fab_size="mini"
fab:fab_label="Camera" />
</com.github.clans.fab.FloatingActionMenu>
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:menu="#menu/activity_navigation_drawer"
android:background="#color/tableHeader"/>
I set this xml on my NavigationActivity where this will be like my BaseActivity and then extended it to all my other Activities.
My problem when running the app the FAB is not displaying, because it has been covered by the xml I assign to the content_frame. But If I put the com.github.clans.fab.FloatingActionMenu in one of my other activities's xml for example in my Home Screen it will display it but i wonder how can I display the FAB without repeating it to add on my xml. All the action of the FAB I put it on my NavigationActivity.
Thank you for the help.
update
By the way I'm using the FrameLayout named content_frame to my other activities to display the xml of that Activity like in my Home Screen like this
FrameLayout contentFrameLayout = (FrameLayout) findViewById(R.id.content_frame);
getLayoutInflater().inflate(R.layout.activity_home, contentFrameLayout);
//i do not have your resource value, so i try to make a test example, which replace your drawer view with textview. If i put framelayout height with match parent, i only see one textview, only if i put the height be 20dp, it will appear both textviews.
<?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">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="20dp"
android:id="#+id/content_frame">
<TextView
android:text="text above"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</FrameLayout>
<TextView
android:text="text below"
android:textSize="20sp"
android:layout_width="wrap_content"
android:layout_height="match_parent" />
</LinearLayout>
What I did is I create two FrameLayout in my activity_navigation.xml
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"/>
<com.github.clans.fab.FloatingActionMenu
android:id="#+id/menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:menu_icon="#drawable/quick_apply"
android:layout_gravity="bottom|right"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp">
<com.github.clans.fab.FloatingActionButton
android:id="#+id/view_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/imgicon"
fab:fab_size="mini"
fab:fab_label="View Images" />
<com.github.clans.fab.FloatingActionButton
android:id="#+id/camera"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/camicon"
fab:fab_size="mini"
fab:fab_label="Camera" />
</com.github.clans.fab.FloatingActionMenu>
</FrameLayout>
Where my FAB is not inside the content_frame, so that it will not overlap.
use Fragment instant of Activity

Android layout objects placement

I have this simple activity in my android app but I don't know how to place my button so it appears at the same position on various screen sizes.
I want the button to always be placed at the bottom of the screen. The screenshot shown is from a phone screen. When displayed on a larger screen the button is higher up.
How can I fix this?
Thanks
See this screenshot
You can use RelativeLayout with this parameter (android:layout_alignParentBottom="true")
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Click Me!"/>
</RelativeLayout>
You should use a RelativeLayout
If you have a RelativeLayout that fills the whole screen you should be able to use android:layout_alignParentBottom to move the button to the bottom of the screen.
If your button at the bottom doesn't show then probably the layout above it takes all the space. In this case you can put the button first in your layout file and position the rest of the layout above the views with android:layout_above.
Have a look a RelativeLayout. Use this ViewGroup and add a Button inside it with alignParentBottom
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
<Button
android:id="#+id/button_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:alignParentBottom="true"
android:text="HORAIRE"
android:layout_margins="<your_margin_in_dp>" />
</RelativeLayout>
Make footerButton.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:text="HORAIRE"
android:textColor="#ffffff"
android:textSize="20sp" />
</RelativeLayout>
And add it in all your layout file like below line:
Android Activity_Layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Footer aligned to bottom -->
<include layout="#layout/footer" />
<!-- Content above footer -->
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/footer"
android:layout_below="#id/header"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Content goes here"
android:textColor="#FFFFFF"
android:textSize="20sp" />
</RelativeLayout>
</RelativeLayout>
Hope it will solve your problem
This is what I ended up doing. Thanks to everyone who posted, it helped me get in the right direction!
<?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:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
tools:context="xxxx.MainActivity"
android:orientation="vertical"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dernières nouvelles Twitter"
android:id="#+id/textView"
android:textStyle="bold"
android:textSize="17dp"
android:paddingLeft="8dp"
android:paddingTop="6dp"
android:paddingRight="6dp"
android:paddingBottom="6dp"
android:layout_alignParentTop="true"/>
<ListView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:id="#+id/listView_tweets"
android:layout_above="#+id/buttonDisplay"
android:choiceMode="none"
android:paddingTop="25dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Horaire"
android:layout_margin="5dp"
android:id="#+id/buttonDisplay"
android:onClick="buttonGotoDisplay"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>

Categories

Resources