I just want to do a very simple think :
I want to put an ImageView on full screen with just a simple TextView on his Bottom, not Over but just on his bottom..
I tried some combination but nothing worked fine..
Here is my current basic XML 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">
<ImageView
android:id="#+id/imgset"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:src="#drawable/creditview" />
<RelativeLayout
android:id="#+id/layoutimgset"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This spot is for Ad"
android:textStyle="bold"
android:textColor="#color/black"
android:background="#color/white" />
</RelativeLayout>
</LinearLayout>
This only show the ImageView..
Try to use for your ImageView this:
android:layout_weight="1"
In this case you don't need RelativeLayout.
Or put all to RelativeLayout and use
android:layout_below="#+id/imgset"
for your TextView
Related
I am having a CollapsingToolbar and a bottom navbar as shown:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:fitsSystemWindows="true"
app:layout_constraintBottom_toTopOf="#id/nav_view"
app:layout_constraintTop_toTopOf="parent">
<!-- Scrollable view here -->
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="#dimen/height335"
android:background="#drawable/ic_appbar_bg"
android:fitsSystemWindows="true"
app:elevation="0dp">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="#color/colorPrimaryDark"
app:toolbarId="#+id/toolbar"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp"
android:gravity="center"
app:contentInsetEnd="0dp"
app:contentInsetEndWithActions="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="2dp"
app:layout_collapseMode="pin"
app:theme="#style/ToolbarTheme">
<include
android:id="#+id/toolbar_header_view"
layout="#layout/widget_header_view_top"
android:layout_width="match_parent"
android:layout_height="wrap_content"
bind:cardDetails="#{viewModel}" />
</androidx.appcompat.widget.Toolbar>
<include
layout="#layout/widget_header"
bind:cardDetails="#{viewModel}" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/swipe"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<!-- just a nestedscrollview
override fun onTouchEvent(ev: MotionEvent): Boolean {
return scrollable && super.onTouchEvent(ev)
}
override fun onInterceptTouchEvent(ev: MotionEvent): Boolean {
return scrollable && super.onInterceptTouchEvent(ev)
}
fun setScrollingEnabled(enabled: Boolean) {
scrollable = enabled
} -->
<com.android.utils.LockableNestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:clipChildren="false"
android:clipToPadding="false"
android:fillViewport="true">
<LinearLayout>
<Some views...
<androidx.fragment.app.FragmentContainerView
android:id="#+id/nav_host_fragment"
android:layout_width="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_height="match_parent" />
</LinearLayout>
</com.android.utils.LockableNestedScrollView>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="#{()->viewModel.fabClicked()}"
android:src="#drawable/ic_plus"
app:fabCustomSize="#dimen/fab70"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
android:elevation="#dimen/elevation3"
android:paddingTop="#dimen/padding10"
app:itemTextAppearanceActive="#style/BottomNavigationViewTextStyle"
app:itemTextAppearanceInactive="#style/BottomNavigationViewTextStyle"
app:labelVisibilityMode="labeled"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/nav_view" />
Fragment container will be replaced with fragments when nav bar items are clicked. The issue is that in one of the fragment I have a recyclerview. The onBindView of all the items in the recyclerview is getting invoked all at once. I need to avoid this mainly because I am trying to implement Pagination like this:
override fun onBindViewHolder(holder: TopUpViewHolder, position: Int) {
val item = myDataset[position]
holder.bind(item)
if (position == this.itemCount - 1){
// do your load more task here
viewModel.fetchTopUpData()
}
}
(I tried attaching scroll listener and implement pagination like this. But the canScrollVertically(1) is getting invoked even when the user has not reached the end, probably because of nestedscrollview itself.)
Here is my fragment with recyclerview:
<?xml version="1.0" encoding="utf-8"?>
<data>
<import type="android.view.View" />
<variable
name="viewmodel"
type="com.android.ui.topup.viewmodel.TopUpViewModel" />
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
android:clipToPadding="false"
android:padding="#dimen/padding15">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
android:clipToPadding="false"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/status_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/padding20"
android:visibility="#{viewmodel.headerVisibility}">
<TextView
android:id="#+id/recentLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin20"
android:text="#string/recent_top_ups"
android:textAllCaps="true"
android:textColor="#color/topup_label_text_color"
android:textSize="#dimen/text12"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/viewAll"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin20"
android:onClick="#{()->viewmodel.viewAllClicked()}"
android:text="#string/view_all"
android:textColor="#color/topup_label_color_orenge"
android:textSize="#dimen/text14"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/topUpRCView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:nestedScrollingEnabled="false"
android:clipChildren="false"
android:clipToPadding="false"
app:scrollListener="#{viewmodel.scrollListener}" />
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="#{viewmodel.fetchingFlag?View.VISIBLE:View.GONE}" />
</LinearLayout>
<LinearLayout
android:id="#+id/empty_list"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="#{viewmodel.listEmpty}"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:src="#drawable/ic_illustration_receipt"/>
<TextView
android:id="#+id/empty_list_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/you_have_no_topup_requests"
android:fontFamily="#font/colfaxregular"
android:textColor="#333547"
android:layout_marginTop="36dp"
android:textSize="#dimen/text16"
android:alpha=".3"/>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Things that I have tried:
Added android:nestedScrollingEnabled="false" in the recyclerview
Added app:layout_behavior="#string/appbar_scrolling_view_behavior"
Changed the height of recyclerview to match_parent wrap_content also 0 and set layout weight as 1(RCV is inside a linearlayout)
https://stackoverflow.com/a/44470106/6341943 => adding a header viewholder for some reason
https://stackoverflow.com/a/37558761/6341943 => cant do this because, I have a bottomnavbar
Now for the Weird part
If I keep my fragment inside a viewpager, for some reason the issue is not happening. (Even this hack is not usable is because it's messing up my collpsingToolbarLayout)
I have wasted at least a week behind this and the only solution that works is to remove the nestedscrollview. To make the recyclerview to actually recycle the view, you HAVE TO REMOVE the nestedscrollview. If you happen to have multiple views inside instead of just the recyclerview, You have to add them as items of the recyclerview by setting different viewholders, and then adding
app:layout_behavior="#string/appbar_scrolling_view_behavior"
to the recyclerview or the parent of recyclerview(the parent cannot have any other view other than Recyclerview for this to work).
In my case, the requirement was as follows:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:fitsSystemWindows="true"
app:layout_constraintTop_toTopOf="parent">
<!-- Scrollable view here -->
<com.google.android.material.appbar.AppBarLayout
.... >
<com.google.android.material.appbar.CollapsingToolbarLayout
....>
<androidx.appcompat.widget.Toolbar
....>
<include
android:id="#+id/toolbar_header_view"
.... />
</androidx.appcompat.widget.Toolbar>
<include layout="#layout/widget_header" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
....>
<LinearLayout orientation="vertical" ....>
<View .../> <!-- I needed to have these two views along with recyclerview and i wanted them to do nestedscroll along with recyclerview -->
<View .../>
<androidx.recyclerview.widget.RecyclerView
.... />
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
I needed to have two views before recyclerview and I wanted them to do nestedscroll along with recyclerview. The only thing that worked was by removing these to views and adding them as the first two items of recyclerview, and then adding
app:layout_behavior="#string/appbar_scrolling_view_behavior"
to the swipetorefresh layout
Hope this helps someone. I will add more info If required.
I've created a AndroidX app using a main Activity with fragments. When I go to my fragment with the recyclerview the recycler view appears over the toolbar for the app. What I need is for the recyclerview to appear below the tool bar...
This is the main view with toolbar
This is the fragment with the recyclerview appearing over that toolbar :
Code for activity_mail.xml :
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="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">
<LinearLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"/>
<FrameLayout
android:id="#+id/fragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#id/bottom_nav_view"
app:layout_constraintEnd_toEndOf="#id/toolbar"
app:layout_constraintStart_toStartOf="#id/toolbar"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="#+id/toolbar"/>
</LinearLayout>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginEnd="0dp"
app:itemBackground="#color/colorPrimaryDark"
app:itemTextColor="#drawable/nav_item_text"
app:itemIconTint="#drawable/nav_background"
android:layout_marginStart="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu"/>
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="end"
android:fitsSystemWindows="true"
android:background="#002B49"
app:menu="#menu/drawer_view" />
</androidx.drawerlayout.widget.DrawerLayout>
EDIT Here is the layout for toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:id="#+id/products_toolbar"
android:layout_width="match_parent"
app:layout_scrollFlags="enterAlways"
android:background="#null"
android:layout_height="?attr/actionBarSize"
app:titleTextColor="#android:color/black"
local:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/rsi_logo"
android:layout_alignParentStart="true"/>
<ImageButton
android:id="#+id/toolbar_button"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/menu"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_alignParentEnd="true"
android:contentDescription="#string/menubutton"/>
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
As an added note this occurs on fragment's with scrollviews as well.
I tried to replicate your problem (created a repo), but I did not find the issue you specified.
Screenshot: Toolbar is shown
So I say that most probably the issue is with your view.RecyclerFragment code. It seems that you are hiding your the toolbar in your view.RecyclerFragment
It's better if you can share your view.RecyclerFragment code also.
Below is an ImageView that can't 'wrap_content' on the height and width as it is displaying the image using Picasso's fit() and centerInside() attributes.
Due to this, I have to either set a height in dp or state 'match_parent'. If I set a specific height in dp my Button will display but this isn't ideal for different sizes screens of course. If I set 'match_parent' the ImageView fills the rest of the screen and I can't display my Button underneath the ImageView.
Does anyone know of a way to nest my ImageView in some way so I can display my final Button?
Also, I can't work out how to align my picture of the top of the ImageView, please help with this as well if you can.
main_activity.xml.
<?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/colorBackground">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:minHeight="?attr/actionBarSize" />
<LinearLayout
android:id="#+id/button_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/toolbar"
android:padding="10dp">
<Button
android:id="#+id/button_kitty"
style="#style/Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_kitty" />
<Space
android:id="#+id/space"
android:layout_width="10dp"
android:layout_height="wrap_content" />
<Button
android:id="#+id/button_cat"
style="#style/Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_cat" />
</LinearLayout>
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/button_layout"
android:layout_marginBottom="17dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="4dp"
android:adjustViewBounds="true" />
<ProgressBar
android:id="#+id/progress_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/button_layout"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginTop="30dp"
android:indeterminate="true"
android:visibility="invisible" />
<Button
android:id="#+id/button_facebook"
style="#style/Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/image"
android:layout_centerHorizontal="true"
android:gravity="center" />
ActivityMain.java
#Override
public void onResponse(Call<KittyCatModel> call, Response<KittyCatModel> response) {
KittyCatModel model = response.body();
String url = model.getSource();
Picasso.with(this)
.load(url)
.fit()
.centerInside()
.into(imageView, this);
}
On Picasso's github, there's a thread regarding fit() not working when an imageView has adjustViewBounds set to true. Remove either one and see how it goes (I'm doing this from mobile, so can't test it before answering, sorry).
Here's a link to that thread:
https://github.com/square/picasso/issues/425
That thread links to another thread on Picasso's git regarding creating a custom imageView to make this work the way you want
Here's a link to that thread:
https://github.com/square/picasso/issues/457
Had some offline assistance with this issue, answer is:
This is nothing to do with Picasso, it is just an XML issue.
The ImageView and ProgressBar needed to be in a RelativeLayout within a
LinearLayout so I could apply layout_weight=“1” to that RelativeLayout.
This allowed me to “match_parent” on my ImageView width and height so
the image fills its layout but doesn’t hide the bottom button.
Hope that helps somebody else in the future.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/color_background"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
android:minHeight="?attr/actionBarSize" />
<LinearLayout
android:id="#+id/button_layout_generate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/toolbar"
android:orientation="horizontal"
android:padding="12dp">
<Button
android:id="#+id/button_kitty"
style="#style/Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_kitty" />
<Space
android:id="#+id/space"
android:layout_width="10dp"
android:layout_height="wrap_content" />
<Button
android:id="#+id/button_cat"
style="#style/Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_cat" />
</LinearLayout>
<RelativeLayout
android:id="#+id/image_layout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/button_layout_generate"
android:layout_weight="1"
android:paddingRight="16dp"
android:paddingLeft="16dp">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true" />
<ProgressBar
android:id="#+id/progress_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:indeterminate="true"
android:visibility="invisible" />
</RelativeLayout>
<LinearLayout
android:id="#+id/button_layout_facebook"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/image"
android:orientation="horizontal"
android:padding="12dp">
<Space
android:id="#+id/space_left"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5" />
<Button
android:id="#+id/button_facebook"
style="#style/Button"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_below="#id/image"
android:layout_weight="1"
android:enabled="false"
android:gravity="center"
android:text="#string/button_facebook" />
<Space
android:id="#+id/space_right"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.5" />
</LinearLayout>
</LinearLayout>
I want to create a horizontal line of small images thumbnails on top of the display. They should be lined up from left to write (all floated left). When you click on a thumbnail, its bigger version should be displayed below this line. I decided to go with a horizontal LinearLayout (see the one with ID = galleryLayout). It should be a LinearLayout because I want to use it later within a HorizontalScrollView. Here is my layout code:
<?xml version="1.0" encoding="utf-8"?>
<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="match_parent"
android:background="#ffffef3a"
android:orientation="vertical"
tools:context=".Gallery01">
<LinearLayout
android:id="#+id/galleryLayout"
android:orientation="horizontal"
android:gravity="left"
android:layout_width="match_parent"
android:layout_height="120dp"
android:background="#ffff3e34">
<ImageView
android:src="#drawable/pic02"
android:layout_gravity="left"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<ImageView
android:id="#+id/image1"
android:scaleType="fitXY"
android:layout_width="320dp"
android:layout_height="320dp" />
</LinearLayout>
But the problem is that the image is displayed in the center of the layout as you can see here:
As you can see the gravity in the LinearLayout does not work and the image is displayed in the center horizontally. The gravity of the ImageView itself does not work as well (that is just an attempt to make it work!).
Do you guys have any idea what I am doing wrong? Thank you for help!!
I could manage to resolve the problem step by step. Here the results:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#000000"
xmlns:android="http://schemas.android.com/apk/res/android">
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="120dp"
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#ffffff">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="left"
android:background="#000000"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:src="#drawable/pic01"
android:layout_width="120dp"
android:layout_height="120dp"
android:padding="10dp"
android:background="#000000" />
<ImageView
android:src="#drawable/pic05"
android:layout_width="120dp"
android:layout_height="120dp"
android:padding="10dp"
android:background="#000000" />
<ImageView
android:src="#drawable/pic03"
android:layout_width="120dp"
android:layout_height="120dp"
android:padding="10dp"
android:background="#000000" />
<ImageView
android:src="#drawable/pic04"
android:layout_width="120dp"
android:layout_height="120dp"
android:padding="10dp"
android:background="#000000" />
</LinearLayout>
</HorizontalScrollView>
<ImageView
android:src="#drawable/pic01"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
It works perfectly :-)
I am trying to build a FragmentTabHost and make it horizontal Scrollable. I've been searching for a solution but couldn't find anything, all posts are about normal TabHost.
I am using the support library as explained in the android site for FragmentTabHost
My layout is :
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:tag="trip_entry_tab"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<FrameLayout
android:id="#+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
</LinearLayout>
Already tried to nest the tabwidget into an horizontal scroll view (this is the solution I could find in other posts, but always for TabHost and not for FragmentTabHost), but nothing changes:
<HorizontalScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="none" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</TabWidget>
</HorizontalScrollView>
My tabs just got shrinked and that is really not nice looking. Has somebody make it to get a fragment tab host scrollable?
Thanks
Based on my experience, the FragmentTabHost doesn't care much about the xml definitions, things must be made programmatically. I got it working by leaving out the HorizontalScrollView from the xml and adding it in my onCreate for the FragmentActivity.
The xml:
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0" />
<FrameLayout
android:id="#+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
Then in the onCreate after adding the tabs (also programmatically):
TabWidget tw = (TabWidget) findViewById(android.R.id.tabs);
LinearLayout ll = (LinearLayout) tw.getParent();
HorizontalScrollView hs = new HorizontalScrollView(this);
hs.setLayoutParams(new FrameLayout.LayoutParams(
FrameLayout.LayoutParams.MATCH_PARENT,
FrameLayout.LayoutParams.WRAP_CONTENT));
ll.addView(hs, 0);
ll.removeView(tw);
hs.addView(tw);
hs.setHorizontalScrollBarEnabled(false);
Don't know if this is the most elegant solution but it seems to work OK.
I was trying various scenarios, and the one that works for me with XML layout is:
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:scrollbars="none" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom" />
</HorizontalScrollView>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
It works fine, the tabs are offscreen to the right an can be 'scrolled' to. Also note, I do not use the "#+id/realtabcontent" FrameLayout.
Resources used:
http://developer.android.com/reference/android/support/v4/app/FragmentTabHost.html
https://maxalley.wordpress.com/2013/05/18/android-creating-a-tab-layout-with-fragmenttabhost-and-fragments/
Regards