Swipe particular part of layout and swipe back - android

I am creating a calculator app in android.Just like a modern calculator you see in your android device. I have created a TextViewand below that, all my buttons are present.I also want to include the trignometric functions so when buttons layout is swipped, i want to show trignometric function and when it is swiped back it show numeric buttons.The TextView should remain constant at the top.Can you somebody please guide me how to do that?

Yes u can do it.
here is an example how to do it
Layout 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" >
<!-- Static content -->
<LinearLayout
android:id="#+id/ll_bottom"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:background="#color/holo_blue_light"
android:orientation="vertical" />
<!-- ViewPager Indicator -->
<com.viewpagerindicator.LinePageIndicator
android:id="#+id/view_pager_indicator"
android:layout_width="fill_parent"
android:layout_height="20dp"
android:layout_above="#id/ll_bottom"
android:background="#color/holo_orange_light"
app:lineWidth="10dp"
app:selectedColor="#fff"
app:strokeWidth="10dp"
app:unselectedColor="#888888" />
<!-- ViewPager containing fragments with different views -->
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/view_pager_indicator"
android:layout_alignParentTop="true"
android:background="#color/holo_red_light" />
</RelativeLayout>
In the blue region you place your static content which doesn't change like the
The orange region is used by the
ViewPagerIndicator and finally the red region is the one of the ViewPager. this area is swipeable.

Related

Activity with two fragments with draggable bar in between to allow resizing of fragment

I am working on a project where I have an activity, which has two fragments loaded in.
I have this working except I want to put a touch bar in the middle between the two fragments, that will allow the user to drag the bar which would then resize the each fragment, i.e. make one fragment grow the other fragment shrink.
Below is the current layout:
<?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"
xmlns:tools="http://schemas.android.com/tools">
<fragment android:name="com.company.myapp.LoginFragment"
android:id="#+id/login_fragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<fragment android:name="com.company.myapp.ApiFragment"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/api_fragment" />
</LinearLayout>
Is there a specific way to do this in Android via an API or will I need to add my own and use touch/drag listeners to resize appropriately.

Android bottom toolbar disappears when fragment fills screen

I'm working on an android app and am using a toolbar at the top of the screen and a navigation bar at the bottom of the screen. I'm using a single activity to create the top and bottom toolbars and fragments to change the content between the toolbars. However, when the contents in the fragment go beyond the size of the screen, the bottom bar disappears.
Here is my home activity xml:
<?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:id="#+id/activity_home"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.rentables.testcenter.HomeActivity">
<include
android:id="#+id/toolbar_main"
layout="#layout/toolbar_main"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<fragment android:name="com.rentables.testcenter.HomeFragment"
android:id="#+id/fragment_place"
android:layout_weight="0"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:layout="#layout/fragment_home" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="bottom">
<include
android:id="#+id/toolbar_navigate"
layout="#layout/toolbar_navigate"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center|bottom"/>
</LinearLayout>
</LinearLayout>
Im guessing it's because of the inner linear layout I have, but I wasn't sure how else to get the nav bar to stay static at the bottom. Any help would be awesome. Thanks
Figured it out. I just changed the whole thing to a relative layout, got rid of the inner linear layout, and instead of gravity I used alignParentBottom="true".

how to swipe only a portion of the layout

I'm using ViewPagerIndicator Library by Jake Wharton and I'm trying to have the same browsing as Tinder and a lot of recent android apps(Talking about the starting screen)...I mean only the top part of the layout is swipeable, and a smaller part at the bottom shows Fb/Twitter/G+ login buttons.
here is a screenshot of what I wish to have : http://i.imgur.com/QK91rBW.png
I already read this Question, but I think it does not answer my need.
Can you guys help me please ?
Well since you'll be using a ViewPager you don't have to think about the region which is swipeable since the height / width of the ViewPager determines this.
Layout 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" >
<!-- Static content -->
<LinearLayout
android:id="#+id/ll_bottom"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:background="#color/holo_blue_light"
android:orientation="vertical" />
<!-- ViewPager Indicator -->
<com.viewpagerindicator.LinePageIndicator
android:id="#+id/view_pager_indicator"
android:layout_width="fill_parent"
android:layout_height="20dp"
android:layout_above="#id/ll_bottom"
android:background="#color/holo_orange_light"
app:lineWidth="10dp"
app:selectedColor="#fff"
app:strokeWidth="10dp"
app:unselectedColor="#888888" />
<!-- ViewPager containing fragments with different views -->
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/view_pager_indicator"
android:layout_alignParentTop="true"
android:background="#color/holo_red_light" />
</RelativeLayout>
Result:
Explanation: In the blue region you place your static content which doesn't change like the Facebook-Button in your example. The orange region is used by the ViewPagerIndicator and finally the red region is the one of the ViewPager. As previously said only this area is swipeable.

Sony SmartWatch - show a view over the Gallery on the

While playing around with the Gallery I've got another question (this probably should be simpler).
I'm trying to show a view, lying in front of the Gallery, probably hiding it partially. Like a message dialog (Toast).
In order to do so, I'm using a FrameLayout with a Gallery in the back, and ImageView with a transparent src in the front. When a dialog should be shown, I'm setting the src to the needed drawable through "sendImage".
The problem is, as I assume, that the gallery/list items (that are added dynamically upon "onRequestListItem -> sendListItem") have more recent z-Order (as they have been added later), so the dialog is shown between the background of the Gallery and the transparent icons, representing the list items.
Maybe someone will have an idea, how to avoid this situation?
I am not aware of any way of adding views manually to the layout on the SmartWatch, or changing their zOrder through "bringToFront".
Here is the source code:
gallery.xml
<?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" >
<Gallery
android:id="#+id/gallery"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:id="#+id/toast"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/toast_dialog_message" />
</FrameLayout>
gallery_item.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" >
<ImageView
android:id="#+id/item_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="20px"
android:src="#drawable/item_icon" />
</RelativeLayout>
GalleryControlExtension.java
sendImage(R.id.spritz_image, drawableResourceId);
P.S. In the emulator it works as expected: toast lies over the item_icon ...

Android CustomListView overlapping other components

In my application I have a header (at the top) and a footer(at the bottom) and a CustomListView inside. I have made the HEADER & FOOTER stationary and they won't scroll. But the ListView which is placed between them, has some components which are overlapping the FOOTER. I somehow want those components in my CustomListView not to overlap the footer. Is there any way this can be done?
The code for my layout is given 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:orientation="vertical" >
<!-- Title Bar -->
<include
android:id="#+id/title_bar"
android:layout_alignParentTop="true"
layout="#layout/title_bar" />
<!-- Settings Components list -->
<ListView
android:id="#+id/custom_items_list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title_bar"
android:layout_weight="1" >
</ListView>
<!-- Options Bar -->
<include
android:id="#+id/options_bar"
style="#style/btn_options_bar"
android:layout_alignParentBottom="true"
layout="#layout/options_bar" />
</RelativeLayout>
Have you tried adding android:layout_above="#id/options_bar" to the ListView? To do so you would also have to move the declaration of the footer to be above the ListView in the layout file so that you are not referencing an id that hasn't been declared yet. But even though the options bar would be listed in the layout before the ListView, it would still get displayed below it because of the options_bar layout_alignParentBottom="true".
I finally found the problem. The problem was, (I don't know why but) I needed to set the layout_height and layout_weight again after <include>
For those who are interested, updated xml is-
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- Title Bar -->
<include
android:id="#+id/title_bar"
android:layout_alignParentTop="true"
layout="#layout/title_bar" />
<!-- Options Bar -->
<include
android:id="#+id/options_bar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
style="#style/btn_options_bar"
android:layout_alignParentBottom="true"
layout="#layout/options_bar" />
<!-- Settings components' list -->
<ListView
android:id="#+id/custom_items_list"
android:layout_above="#id/options_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/title_bar">
</ListView>
</RelativeLayout>

Categories

Resources