Develop Reference

Click arrow to reveal more content in application

i am trying to achieve a behavior where user click an arrow that can reveal more content such as more description abort something. It can a recycler view as well where more things can be added dynamically and the list will expand.Right now i do not have any idea how it can be achieved. I tried searching on the internet for solutions and saw a widget called spinner but i do not think it can help me achieve my desired behavior. YouTube does apply similar behavior as well
Below are the pictures which will make my question clear. Any help would be appreciated Thank You
Before clicking the arrow pic 1
After clicking the arrow pic 2

In your layout.xml include a nested layout that includes a Textview that holds the additional information and set android:visibility="gone". Use an OnClickListener to the button that is meant to expand the view. In the onClick method check if the view is visible or not. If it's not you make it visible, otherwise you set it to gone again.
layout:
...
<ImageView
android:id="#+id/chevron"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#android:drawable/chevron"
/>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="your additional info here"
android:visibility="gone"/>
...
In your Activity:
ImageView yourView = findViewById(R.id.chevron);
..
yourView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if (view.getVisibility() == View.Gone) {
view.setVisibility(View.Visible);
} else {
view.setVisibility(View.Gone);
}
}
});

I used for this purpose ExpandbleLayout from this github library
ExpandableLayout. In readMe of the github repo you can find example of using it, you can get similar experience with as in your example, without need to manually create View for arrow and handling the animation.
You can use it like this :
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<com.github.aakira.expandablelayout.ExpandableRelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:ael_expanded="true"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Some text goes here"
android:textSize="28sp" />
</com.github.aakira.expandablelayout.ExpandableRelativeLayout>
And in your java/kotlin code : do additional logic to expand/collapse call : expandableLayout.toggle();.
All the credit goes to the author of the library.
https://github.com/AAkira/ExpandableLayout

How add multiple TextView inside an ImageButton?

Is it possible to add multiple TextView inside one ImageButton with colour background ?
The core need is to have a button with the action text on it, and a subtext nearby explaining the action or giving other information related to the action. This subtext can vary from time to time.
Considering this requirement, one solution is to have a normal button and a subtext below, not clickable. But I find it messy. A better approach which I like is, on iOS for instance, to have a clickable UIView containing the action as bold text and the explanation as light text. See the image bellow containing 4 buttons :
How to achieve the same on Android with Java ? The closest I can have is to have an ImageButton bellow a TextView, and it does not sound right.
Is possible to nest TextViews inside an ImageButton ? If not, what is the best alternative ?

I hope this may be useful it explains how to position a textView within and in front of a imageView in the XML.
TextView inside of ImageButton/ImageView XML - Android Dev
Obviously make sure each view has a unique id/name which you can assign as shown here on this link
Sorry I cannot explain specifically myself but it has been a while since developing in Java for Android.

I dont know why you want this behaviour but you can make a container for your views and add a click listener to the whole view. you can also use it anywhere.
an example of this would be.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:background="#drawable/container_background"
android:layout_height="wrap_content">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="0.33"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="0.33"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="0.33"
/>
add a selector background
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#color/text_pressed" />
<item android:color="#color/normal" />
</selector>
and the listener
findViewById(R.id.container).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
}
});

UI flicker while pressing back in android

I am creating a UI for my company which has a edit-text at top and a frame layout at bottom. this frame-layout contains a mic image and animation on pressing of which it goes through 3 main state like listening.thinking and idle state.
So in short, user can provide query either by typing in edit text or by providing command by voice.
My problem occurs when user click on edit-text to provide text command. When user do so the android keyboard comes up and user insert text but after entering text if user press back button the ,the whole UI comes up before going down. This all happens very quickly and to a user it gives bad impression. It feels like UI is getting stuck but this is how by default android is handling it.
Is there a way by which I can stop this flickering or make this move smoothly.?
Currently I am making this frame layout invisible when user start editing and visible when user has finished editing but this also does not help.
I know by not providing complete code it is not a good way of asking a doubt.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
style="#style/main_style_mainLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
android:id="#+id/dialog"
style="#style/main_style_dialog"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="360dp"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ScrollView
>
<!--will dynamically add here widgets and edit text button as required>
<LinearLayout
android:id="#+id/linearLayout"
style="#style/main_style_scrollViewlinearLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</LinearLayout>
</ScrollView>
</LinearLayout>
</RelativeLayout>
<FrameLayout
android:id="#+id/mainControlLL"
style="#style/main_style_mainControlLL"
android:layout_width="fill_parent"
android:layout_height="wrap_content" > // Act as parent container for mic image and text view
<FrameLayout> //contains text view which gets displayed on top of mic image
<TextView/>
</FrameLayout>
<FrameLayout
android:id="#+id/mic_btn_layout"
style="#style/main_style_mic_btn_layout"
android:layout_width="wrap_content"
android:layout_height="118dp" >// contains mic images
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clipChildren="false" >// contains mic image for listening state
<ImageView/>
<ImageButton />
<ImageButton/>
<ImageView />
</FrameLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical|center" >//contain mic images for thinking state
<ImageButton />
<ImageButton />
<ImageView />
</RelativeLayout>
<ImageButton />//contains mic image for idle state
</FrameLayout>
</FrameLayout>
</RelativeLayout>
And in my manifest I have
android:windowSoftInputMode="stateAlwaysHidden|adjustResize" and
android:configChanges="keyboard|keyboardHidden|orientation|screenSize|locale"
Please let me know how i can correct my UI behavior.

You should put your activity state on a stack, since you are using fragments(more on this here) and override the onBackPressed() function and restore your fragment state there.
#Override
public void onBackPressed()
{
// restore fragment/activity state here
super.onBackPressed();
}

Below is API which I have modified to stop flickering.
#Override
public boolean onKeyPreIme(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_BACK && event.getAction() == KeyEvent.ACTION_UP) {
this.clearFocus();
//Fix- Ui Flicker
// this.setFocusable(false);
// this.setFocusableInTouchMode(false);
return false;
}
return super.dispatchKeyEvent(event);
}
In above API I commented the piece of code shown above.
But Can some one explain why it was causing the jumping(going up) of UI. It was only disabling the focus of view.

Basic issue with Java/Android

I started learning java a few days ago, so I'm quite lost with it.
I want to show a text received from an intent and make it look like this:
"You've written : ."
It isn't working at all and I'm only able to show the text from the intent.
Here's my code:
// Create the text view
TextView textView = new TextView(this);
textView.setTextSize(40);
System.out.print("You've written: ");
textView.setText(message);
System.out.print(".");
// Set the text view as the activity layout
setContentView(textView);
}
Besides, I'm trying to display the text written above in the first line of the page (or as many lines it takes) and, below, a label to insert a text together with a Button. The problem is that I can only see the text from the intent.
Here's my code:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".DisplayMessageActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world" />
<EditText android:id="#+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="#string/edit_message" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send"
android:onClick="sendMessage"/>
</RelativeLayout>
Thankyou very much, I wish I'll be answered soon.

Instead of System.out.println.
Do like this.
<TextView
android:id="#+id/topTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
and Get the view in activity.
public void onCreate(Bundle bundle) {
.........
setContentView(layout_xml);
TextView textView = (TextView)findViewById(R.id.topTextView);
textView.setText("You've written: " + message + " .");
.........
}

If you are trying to reference the TextView inside your layout it needs to referenced in the Activity. The above solution shows you how to handle that. setContentView(R.layout.file_name) is what should be used to reference a layout created inside an xml file stored in res/layout/file_name.xml or created manually inside your code. If you are going to call setContentView for a layout contructed inside your (Activity) it will take some more code. If the message is all is need to be displayed you can always call Toast.maketText(Context, message, Toast.LENGTH_SHORT).show(); for example. The other suggestion is Java developers are used to using System.out.println() to debug to the console. In Android they have a neat feature we use called LogCat that can display messages going on inside your code by saying (example for debugging purposes)
Log.d(TAG, message); Where TAG is usually a constant defined for the Activity,Fragment, etc. you are in so you can see where the message is coming from and display whatever value you normally would have used in System.out.println().

Android: edit textview defined in xml

I have been sitting for at least 4 hours trying to solve this problem.
To understand this there are 3 files you need to know about:
eggCatcher.java which extends Activity, this class is not used for much more than
saving gamestate and showing the optionsmenu.
eggCatcherView.java which extends SurfaceView and contains "the game".
eggCatcher_layout.xml which is shown below:
<?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:id="#+id/layouten">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<easter.fun.EggCatcherView
android:id="#+id/eggcatcher"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true">
<TextView android:text="Score: "
android:id="#+id/totalscore"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true">
</TextView>
<TextView android:text="Bonus: "
android:id="#+id/bonus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true">
</TextView>
</RelativeLayout>
</FrameLayout>
</LinearLayout>
As shown in the xml file, EggCatcherView is put in the xml file.
When the applications i started the onCreate calls setContentView(layout.eggcatcher_layout);
My question now is:
how can i, from EggCatcherView.java access and edit the TextViews defined in the xmlfile?
if it was in EggCatcher.java it would be easy, just use findViewById(id.bonus), but from
inside the surfaceView appears to be a little more difficult.
I hope i have made everything clear, if you dont understand just ask!
//micke

I think you should get the parent view and then from there on you can use findViewById() (are you sure you can't just use that method anyway since SurfaceView is a subclass of View and inherits findViewById() from it?).
For using the parent you do something like:
ViewParent vp = eggCatcherView.getParent();
FrameLayout fl = (FrameLayout) vp;
TextView tx = (TextView) fl.findViewById(R.id.bonus);
Of course you need to check if the ViewParent is indeed an instance of FrameLayout.

I found this the best way:
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello"
android:id="#+id/test"/>
</LinearLayout>
TextView test = (TextView) findViewById(R.id.test);
test.setText("test");

If I understand correctly, you want to access the views in the surrounding activity? That seems like poor architecture. I think it would be better to either pass a callback to the EggCatcherView that can trigger methods in the Activity which in turn operate on the TextViews or fire some kind of events upwards.