We Keep Coding

How to fix this > attribute app:constraintBottom_toBottomOf not found

Android newbie here.
I am building and AR app and now I'm planning to add a User Interface. I am trying to add a constraint layout to app:layout_constraintBottom_toBottomOf="parent", however Im getting the error that this constraint was not found
These are my codes and error messages:
All the lines of code I add in my activity_ux.xml file that begin with "app"
e.g. app:layout_constraintBottom_toTopOf do not seem to work, I just showed you an example here with one of them just to make it easier to debug I think.
I tried searching online, one of the solutions was that I should install "ConstraintLayout for Android" and "Solver for ConstraintLayout" in my SDK Tools, but I already had this installed.
<FrameLayout
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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.google.ar.sceneform.Overlei.Overlei">
<fragment android:name="com.google.ar.sceneform.ux.ArFragment"
android:id="#+id/ux_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="#+id/gallery_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="parent"
>
</LinearLayout>
</FrameLayout>
I expected this to just work, I don't know where I can start looking if an in-built function(such as this) does not work.

Thanks for the suggestions guys. I have managed to deal with the error by adding this line
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
into my build.gradle(module.app) under dependencies
Again, thanks for everything

You should use app:layout_constraintBottom_toBottomOf only in ConstraintLayout. You can try to use inside of FrameLayout
then android:gravity = "bottom" in your LinearLayout.

Wrap you FrameLayout in a ConstraintLayout or change the FrameLayout to ConstraintLayout

Android Watch fullscreen FAB like the DismissOverlay

There is the DismissOverlayView, which you can implement to give the user an alternative way to exit the application on an android watch. This View implements something, that looks like a fullscreen FAB. Now I would like to know, how I could implement the same View with another button icon/color/behaviour. Since you can't change the DismissOverlayView which code looks btw. like this :
<android.support.wearable.view.DismissOverlayView
android:id="#+id/dismiss_overlay"
android:layout_height="match_parent"
android:layout_width="match_parent"/>
I guess you have to implement some custom FAB, but I can't use the FAB in my watch XML either because there is an dependency missing or because it's simply not supported by the watch os. I tried following code for testing :
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_margin="16dp"
android:clickable="true"/>
Edit: For better understanding, I want the button look like this :
Edit: I just found this solution, I was not aware of that one :
https://developer.android.com/training/wearables/ui/confirm.html
But I would still be curious, if you could implement a more customisable version of this buttons.

Okay I found a solution for that problem, actually you can simply create a new layout.xml and overwrite the default code, which is the following one :
<merge xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
<TextView
android:id="#+id/dismiss_overlay_explain"
android:layout_gravity="center"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="32dp"
android:layout_width="wrap_content"
android:padding="12dp"
style="#style/DismissOverlayText"
/>
<android.support.wearable.view.ActionPage
android:id="#+id/dismiss_overlay_button"
android:layout_height="match_parent"
android:background="#color/dismiss_overlay_bg"
android:layout_width="match_parent"
android:src="#drawable/ic_full_cancel"
android:color="#color/dismiss_close"
app:buttonRippleColor="#color/dismiss_close_pressed"
android:text="#string/dismiss_overlay_button_label"
/>
</merge>
Now you can use your newly created xml customise it and use this one instead of the original dimissOverlayView. But you should be careful with doing so, because this is not really intended from the design guidelines to do.

Android app tutorial content.xml and activity.xml files have different code to tutorial

I'm working through the android tutorial at
http://developer.android.com/training/basics/firstapp/building-ui.html
I've created the project as stated in the tutorial however the code that it says is supposed to be in my activity.xml file is instead in my content.xml file its as if they have swapped?
Code in activity xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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" android:fitsSystemWindows="true"
tools:context=".MyActivity">
<android.support.design.widget.AppBarLayout android:layout_height="wrap_content"
android:layout_width="match_parent" android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar android:id="#+id/toolbar"
android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_my" />
<android.support.design.widget.FloatingActionButton android:id="#+id/fab"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_gravity="bottom|end" android:layout_margin="#dimen/fab_margin"
android:src="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
Code in content xml:
<?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:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main" tools:context=".MainActivity">
<TextView android:text="Hello World!" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
The tutorial is telling me to change the relative layout block to linear layout (which it says should be in the activity xml, but for me its in content xml)
So when I replace the code in activity xml with what the tutorial has it gives me errors because I removed the code that was there previously.
OR
if I edit the code in content xml and run the app I can't see the changes because activity is not updated, and I cant move the linear layout code to activity xml because it gives me "multiple root tags" error.
Can someone show me a solution that will allow me to continue with the tutorial, because if I edit the java code or something like that I get problems with later stages in the tutorial.
Thanks

Instead of working on the activity.xml try editing the content.xml to reflect the LinearLayout change (do add the orientation value as shown).
<LinearLayout 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:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
android:orientation="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main" tools:context=".MainActivity">
<TextView android:text="Hello World!" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
Do also go through on the Android Getting Started Resources. They will come in handy

You just have to keep in mind that these .xml files represent the layout part, the UI.
To put it simply, a 'screen' in Android is composed of 2 files : the layout (the .xml file), and its associated .java file.
Here, we can see that your "content" is included in your "activity".
It's quite the same thing as putting directly the content of "content.xml" into "activity.xml".
What is in the "OnCreate()" method of you MyActivity.java ?
Have you tried replacing the "include" in "activity.xml" by the actual content of "content.xml", not forgetting to remove "root specific" values (xmlns:android, xmlns:tools, xmlns:app and tools:context)?
As fernaMuruthi said, try following the Android Getting Started Resources. Also, try not to use the graphic designer : it sometimes generate crappy code. instead, Type you UI pseudo-xml directly.

I was having the same issue. Never really worked with XML, and my Java is rusty. I ended up searching online a bunch and this is what I found out.
The .xml files are used to determine your layouts for your activity. They can be used in conjunction with one another or separately. This means using content.xml and main_activity.xml don't really matter. However because the tutorial is not very clear about this, it makes it hard for newcomers to figure out a work around.
The solution is to understand what the MainActivity.java file is doing with your .xml files. Mike James at i-programmer explains this fairly well...(http://www.i-programmer.info/programming/android/5914-android-adventures-activity-and-ui.html)
There is a method called onCreate() that controls which layout is being used by MainActivity.java. Here you will see the auto generated function setContentView() this is the main issue with determining what is being displayed in the app.
There is also a bunch of other generated code that is used to get more data from main_activity.xml. If you look at the code you will see what needs to be removed.
Hope this helps. Please up vote if it did :)

So, if you follow the tutorial to a tee, i.e. make your activity_my.xml file the exact same as what they are expecting, then you will see the edit text view and the button view as depicted.
It seems that quite a bit has been added to the blank activity template since the creation of this tutorial, making the tutorial quite obscure.

After looking around for a while and trying multiple solutions I finally realized that the toolbar created in activity_my.xml was obscuring the text/button created in content_my.xml.
My solution was to just pad the linear layout.
android:paddingTop="55dp"
But then again I'm on day #2 in the Android/Java world...

How do I use this custom drawable class?

Im fairly new to android programming so im not sure on this.
Im trying to set a png as a background but the image is stretching when i use android:background="#drawable/bkgrnd" in my layout xml file
I found this custom class here http://www.anddev.org/viewtopic.php?p=27178#27178 but im not sure how to use it in my code.
Ive copied the code into its own class file and no errors are present.
How do I set the background to the drawable above using this class?
NB: I have abandoned this approach and gone with something much simpler. The answers below did give clues along with some other stackoverflow questions. Answer is below.

Please try this one it will help you.
android:src="#drawable/bkgrnd"

The result can be achieved using scale drawables instead
bkgrnd.xml (drawable xml file)
<?xml version="1.0" encoding="utf-8"?>`
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="#drawable/bkgrnd"
android:scaleGravity="clip_horizontal"
android:scaleHeight="100%"
android:scaleWidth="100%"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
layout.xml
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/bkgrnd" />

In your XML, declare an ImageView like this
<ImageView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#drawable/bkgrnd"
android:scaleType="fitXY"
android:layout_alignParentRight="true"
/>

Change xml bar in runtime

I wish to change my app:footercolor value defined on xml file, and I want to do this while runtime.
How can I achieve this? I haven't found any information about how to do this. I'm find very hard to learn something just about changing xml through java. I'm certain that there must be a way to make that happen and I just can't figure it out.
Here is the xml file:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<com.viewpagerindicator.TitlePageIndicator
android:id="#+id/indicator"
android:padding="10dip"
android:layout_height="40dp"
android:layout_width="fill_parent"
android:background="#000000"
android:textColor="#1573D6"
app:footerColor="#1573D6"
app:footerLineHeight="2dp"
app:footerIndicatorStyle="none"
app:selectedColor="#FFFFFF"
app:selectedBold="true" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />
Thank you

The XML definitions will get turned into Java Objects when the activity is launched. So what you need to do is to get a reference to those Java objects and change them - instead of trying to modify the XML.
I'm not very familiar with Android, but I think the following will work:
TitlePageIndicator titleIndicator = (TitlePageIndicator)findViewById(R.id.indicator);
int blue = 0xFF;
titleIndicator.setFooterColor(blue);
titleIndicator.invalidate(); // get the UI to repaint this View at some point
Let me know how it goes!