Making a button transparent Android? - android

How do I get rid of the white bit around the button? I don't want the button transparent, but I want the white bit around it. I've got Google Maps behind the button.
I've tried android:background="#android:color/transparent", on the Button, but it's only the button that becomes transparent (not the white bit around it).
How do I do this in XML?
<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:orientation="vertical"
tools:context=".MyLocation" >
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#android:color/transparent"
android:gravity="center" >
<Button
android:id="#+id/filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="filterMenu"
android:text="#string/filter_button" />
</FrameLayout>
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
</LinearLayout>

How about setting the background of RelativeLayout to transparent?
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent" >
<Button
android:id="#+id/filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:onClick="filterMenu"
android:text="#string/filter_button"
/>
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
</RelativeLayout>
And why not using FrameLayout anyway? It's better in performance than RelativeLayout.
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#android:color/transparent" >
<Button
android:id="#+id/filter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="filterMenu"
android:text="#string/filter_button"
/>
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
</FrameLayout>

try this:
MybuttonName.getBackground().setAlpha(0);
0= Completely transparent.
255 Completely opaque.

How about this.
Button filter = (Button) findViewById(R.id.filter);
filter.setBackgroundColor(Color.TRANSPARENT);

try this
android:background="#android:color/transparent"

Related

Softkeyboard pushes whole layout to the top

I am working on an app in which I have implemented the live video broadcasting, and have a feature to place a live comment just like a Facebook live video feature. The problem I am facing is with EditTextView for comments. When Soft Keyboard appears on the screen It pushes the layout to the top.
I have tried to adjustResize, adjsutPan & adjust Nothing properties in Manifest. But these properties doesn't fulfill the UI requirement. What I want is to just move EditTextView to the top of Soft Keyboard and the rest of the layout as it is.
Layout
<?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"
android:background="#color/white"
android:clickable="true">
<org.webrtc.SurfaceViewRenderer
android:id="#+id/camera_view_renderer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:drawingCacheQuality="high"
android:fitsSystemWindows="true" />
<RelativeLayout
android:id="#+id/top_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:clipChildren="false"
android:clipToPadding="false">
<View
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#drawable/top_gradient" />
<include
android:id="#+id/headerLayout"
layout="#layout/header_layout" />
<com.lts.localee.customViews.LTextView
android:id="#+id/my_points"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/headerLayout"
android:gravity="center"
android:text=""
android:textColor="#color/white"
android:textSize="16dp" />
<com.lts.localee.customViews.PointsRangeComponent
android:id="#+id/points_range_component"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_below="#+id/headerLayout"
android:layout_marginBottom="120dp" />
<View
android:id="#+id/_background"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#AA2f3c43"
android:visibility="gone" />
<FrameLayout
android:id="#+id/livePredQuestionGameSubBaseContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="false" />
<com.lts.localee.customViews.LTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="7dp"
android:layout_marginTop="100dp"
android:background="#drawable/rounded_button_prediction_pressed"
android:gravity="center"
android:minWidth="60dp"
android:padding="10dp"
android:text="sadas"
android:textColor="#color/white"
android:textSize="18dp"
android:visibility="gone" />
</RelativeLayout>
<com.lts.localee.customViews.TriviaCommentComponent
android:id="#+id/comments_component"
android:layout_width="match_parent"
android:layout_height="120dp"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:visibility="visible"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
Please help me out to solve this issue. Thanks
use android:windowSoftInputMode="adjustPan|adjustResize" inside your manifest
If android:windowSoftInputMode="adjustPan|adjustResize didn't help you, I think it's better to use <ScrollView> in your XML file

Add custom location button in right bottom corner like in GoogleMaps

What is the best way to add a button to the bottom right corner in my app with the maps, and change this button in different states like in GoogleMaps? I am using OSMDroid and need add custom button, not default.
use this layout and it get you what you are looking for
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<ImageView
android:id="#+id/imageViewFlagPassenger"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#android:color/transparent"
android:src="#drawable/marker" />
<ImageView
android:id="#+id/btn_passenger_current_location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="20dp"
android:layout_marginRight="10dp"
android:background="#drawable/location_icon" />
</RelativeLayout>
</LinearLayout>

Elevation not working for BottomSheet inside Coordinator layout

I am trying to use a BottomSheet in my layout.
The root view is an CoordinatorLayout and I want to set Elevation on top for the Bottom Sheet so i am setting it with a high value (50dp), however it is not showing when the app runs but it appears on android studio design tool.
I have tried to set background for the sheet with a solid color instead of gradient but it still did work. I also tried to use Shadow shapes but it does not give the same elevation appearance.
here is my XML
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.atefhares.StartActivity"
android:clipToPadding="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/DetailsView"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Details Should be shown here"
android:id="#+id/textView"
android:textSize="25sp"
android:padding="20dp" />
</LinearLayout>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.atefhares.Start_Activity" />
</LinearLayout>
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_peekHeight="70dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
android:background="#drawable/gradiant"
android:fillViewport="true"
android:elevation="50dp">
<include layout="#layout/bottom_sheet_layout"/>
</android.support.v4.widget.SlidingPaneLayout>
</android.support.design.widget.CoordinatorLayout>
Edit:
bottom_sheet_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#color/colorPrimary"
android:padding="10dp"
android:id="#+id/inviteLL">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/imageView"
android:background="#drawable/invite_icon"
android:layout_margin="5dp"
android:layout_gravity="center_vertical" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Invite Friends"
android:textSize="22sp"
android:textColor="#ffffff"
android:padding="10dp"
android:fontFamily="sans-serif-condensed"
android:gravity="center_vertical"
android:id="#+id/inviteTV"
android:layout_gravity="center_vertical"
android:layout_weight="1" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/arrowIV"
android:layout_gravity="center_vertical"
android:background="#drawable/arrow_up" />
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:id="#+id/usersLV"
android:dividerHeight="1dp"
android:divider="#ffffff"
android:background="#ffffff" />
</LinearLayout>
So how can I make the elevation shows on top of the Bottom Sheet
Any one can help, please ?
Try this,
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/bottom_sheet"
xmlns:slide_panel="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_peekHeight="70dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
android:background="#drawable/gradiant"
android:fillViewport="true"
slide_panel:elevation="50dp">
According to the google guidelines with the android:elevation is not possible (Also you can read more about the keyligth).
Anyway on the most common cases when you scroll up the "BottomSheet" a semitransparent layer appears behind the "BottomSheet", this helps to keep the user focus on the "BottomSheet" actions, like these examples.
If anyway you want a top shadow you can set a drawable background with gradient like this (shadow_top.xml):
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:angle="90"
android:centerColor="#000000"
android:endColor="#android:color/transparent"
android:startColor="#000000"
android:type="linear" />
And your SlidingPanelLayout will be:
<android.support.v4.widget.SlidingPaneLayout
android:id="#+id/bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:behavior_peekHeight="95dp"
android:paddingTop="25dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
android:background="#drawable/shadow_top"
android:fillViewport="true"
>
Best regards.
Do not forget that to draw shadow you must use hardwareAccelerated drawing
hardwareAccelerated = true
hardwareAccelerated = false
See Android Hardware Acceleration for details
The answer is: no, it is not possible (unless you create your own view custom with an elevation feature on top).
Elevetion is not meant to be visible in the top of a view, but in the bottom, on the right and on the left.
If you see closely on the official Material Design guidelines, you can see that the bottom bar simply don't have it (do not confuse with the gray space between the card and the bottom bar).
For example: import Card View sample from Android Studio and play with it with emulator or your device. You will see that if you increment the elevation value, the view will have his shadow everywhere except on top (see second image below).
Another example is given by importing Elevation Basic.
EDIT
Following code is taken from Card View sample. There is a layout containing a CardView with elevation. Whenever you change the elevation, you will always see shadow everywhere, but not on top (the code was tested with Lollipop and Marshmallow).
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
>
<android.support.v7.widget.CardView
android:id="#+id/cardview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:elevation="100dp"
card_view:cardBackgroundColor="#color/cardview_initial_background"
card_view:cardCornerRadius="8dp"
android:layout_marginLeft="#dimen/margin_large"
android:layout_marginRight="#dimen/margin_large"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_medium"
android:text="#string/cardview_contents"
/>
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/margin_large"
android:orientation="horizontal"
>
<TextView
android:layout_width="#dimen/seekbar_label_length"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="#string/cardview_radius_seekbar_text"
/>
<SeekBar
android:id="#+id/cardview_radius_seekbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_medium"
/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<TextView
android:layout_width="#dimen/seekbar_label_length"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="#string/cardview_elevation_seekbar_text"
/>
<SeekBar
android:id="#+id/cardview_elevation_seekbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_medium"
/>
</LinearLayout>
</LinearLayout>

Button text is greyed out in android google map

I have a button I placed ontop of my google map, but the text is all grayed out like this:
Is there anyway to make the text not grayed out so it will be easier to read?
My xml is:
<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"
tools:context=".MainActivity" >
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.MapFragment" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Navigate to Brewery"
android:id="#+id/button2"
android:textColor="#color/orange"
android:textStyle="bold"
android:onClick="getMap"
/>
</RelativeLayout>
android:textColor="#color/orange"
Try using white instead

SlidingDrawer over GoogleMap

First of all, I know the SlidingDrawer is deprecated, but I haven't found any alternative to it so I'm using it anyways :3 (If someone knows an alternative to it, please share it!)
So I have a GoogleMap in my activity (actually a fragment but it doesn't matter), and a nice SlidingDrawer in the same screen. It works fine, but when I open or close the slidingdrawer over the map, it starts behaving weird. It looks like the map want's to stay in front of the slidingdrawer. When the drawer is fully opened, then it comes back to the front and everything is ok.
Is there a workaround for this? I am getting crazy!
here is my layout:
<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"
android:id="#+id/window"
>
<fragment
android:id="#+id/hackedmap"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.google.android.gms.maps.SupportMapFragment" />
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:content="#+id/drawercontent"
android:handle="#+id/drawerhandle"
android:orientation="horizontal"
>
<LinearLayout
android:id="#id/drawerhandle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:gravity="center" >
<ImageView
android:id="#+id/slidingHandle"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitEnd"
android:src="#drawable/sliding_handle" />
</LinearLayout>
<LinearLayout
android:id="#+id/drawercontent"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#DD000000"
android:gravity="center_horizontal|top"
android:orientation="vertical" >
<TextView
android:id="#+id/selectednet"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="4dp"
android:text="Select a network:"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#02bceb" />
<ListView
android:id="#+id/passivelist"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:choiceMode="singleChoice" >
</ListView>
</LinearLayout>
</SlidingDrawer>
</RelativeLayout>
Put the map inside of a relative layout. In front of the map a view with the same measure.
Example:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<include
android:layout_width="wrap_content"
android:layout_height="250dp"
android:layout_weight="1"
layout="#layout/general_map_fragment" />
<View
android:id="#+id/imageView123"
android:layout_width="match_parent"
android:layout_height="250dp"
android:background="#color/transparent" />
</RelativeLayout>

Categories

Resources