Use different android switch style? - java

I am very new to Android programming, but would like to change the style of my Switch View element so that it looks similar to the one that is displayed on the Android website:
and not like the one that I currently have:
I assume that because this is on the Android website it would not be difficult to change to this Switch style, but as I am new to Android development, I don't even have the faintest idea how to change this, and a large amount of time spent searching for the answer has not turned anything up as to what is causing my style to differ from the one on the website. Any help is welcome, thank you!

That's actually different enough that its going to be a pain- particularly the text on top of the switch instead of to the side. But lets ignore that and assume you only want to get the rest of the look, that you don't want words (words on a switch are a bad idea anyway, the word for "on" might be 7 characters in some language).
You can set the thumb drawable in xml via android:thumb. You can set the drawable for the background with android:track. If you want the side of the long area of the thumb to change,(its on top in your drawing on "on" and the bottom on "off") you'd need to change the thumb drawable when the state changes. The tinting of the thumb/track are controlled by android:trackTint and android:thumbTint.
You can see the other switch-specific xml properties at https://developer.android.com/reference/android/widget/Switch.html

Related

Android: edit colors for entire layout programmatically

I'd like to create a layout displaying a music album's tracks, with the text and background colors being taken from the album cover's color palette. I know how to retrieve the color palette, but I am unsure how to easily apply it programmatically to an entire layout, without manually finding each individual view and changing the colors appropriately. I have only found solutions where themes are changed before creating the views, but those themes are already predefined in the resources, not dynamically generated on the album cover.
Is there some way for me to write a layout in XML referencing colors like "color1" and "color2", and then at runtime assigning an actual value to these colors, such that I don't need to painstakingly modify every view programmatically myself?
I'm not sure it's possible to do that through XML normally, since you're referring to resource IDs and those resources are fixed at runtime. The Theme class also links attributes to resources, so you can't just inject the values you want (as far as I know) into a Theme and then apply that to the Activity. (I don't know a lot about the styling/theming system though so it's possible you can do some wild stuff with it!)
There's a couple of things you could look into though. If you're happy to use the new Material 3 system, that has dynamic colour baked into it, including theming parts of the app with colours derived from content like album art.
But from that outline, it looks like it pulls a single colour from the image, and derives a couple of complementary, neutral colours from it - so it's not pulling multiple colours from the image like the Palette library does. The Material 3 stuff has a particular tone to it (limited colour variation, not too much contrast, consistent look) and if that works for you, great! But if you want a more vibrant palette, you might need to use Palette instead (that link up there shows how you're meant to use it, the examples are basically "apply colour to each view/component in code")
The other thing you could try is using data binding, and instead of using resource IDs and attributes in your XML, you could reference properties on a ViewModel. So you could create LiveDatas for things like primaryColour, secondaryColour etc, and bind to those when setting the colour attributes in your XML. And then by updating a value in the ViewModel, any views bound to that property will see the change. And that binding is defined in the XML, you don't need to know which View is using which colour in your code.
I've never actually used data binding, never mind for colour updates, so I'm not sure how well it would work or if you need to give things a kick to get them to refresh visually - I'd imagine it just works like setting a new value through code, but I'm not sure so I just want to be clear about that!
But if you want smooth colour transitions (e.g. switching albums fades the colours) then I'm not sure there's anything that does that out of the box - maybe the Material 3 stuff does it. You could probably do it with the ViewModel approach though - when you set a new colour, kick off a coroutine that interpolates between the current value and the new one over 1 second or whatever, updating the LiveData every tick.

Is there an easy way to show borders around Views and ViewGroups in the design tab of Android Studio for debugging and styling purposes?

I would like to see visually how much space each box takes with as little effort/changes to the code as possible.
I would like to know if it's possible to just put a line around the outer margins of the View or ViewGroup object.
Since it's just for debugging and styling I would like to also quickly turn it off, so I do rather make the changes to my code in one place so it's easy and quick to undo. Is this a default option I am missing? Somehow I expect this feature to exist already.
Here someone asks a different but slightly related question with not a nice answer for my case.
Here someone gives an answer on how to outline one View.
Border for an Image view in Android?
Code-wise you could follow the answer to the first link you posted and create a drawable with the name "developer_borders" or something similar and apply it to every view you wish to have its borders visible.
To easily remove it afterwards, you can right-click the directory of your project and click Replace in Path.... For Text to find you want to search for android:background="#drawable/developer_borders and for Replace with don't use anything. This will find every occurrence of what you are searching and replace it with an empty string.
There might be an easier option. Some devices have quite powerful Developer Options. "Show layout bounds" is what you want but take a look at the rest while you are at it, some are pretty awesome.

Android - Help needed with designing a screen with either table layout or list views

I am currently developing an Android app that is to be a counterpart to its sister iPhone prototype.
My task is to recreate the screen from a design mockup from the iPhone app in Android, as shown here:
What would be the best layouts / views to use for replicating this screen in an activity?
Thanks.
Your question does not clear some things up. Also, I disagree with Ted Hopp's answer. I believe he is assuming that the medications will be filled statically, or something like that.
By the looks of your app, I assume you will be filling stuff dynamically, probably with many medications at once, or no medication at all. By the arrows in the iPhone mock-up, I also assume you will want to perform actions depending on the medication selected.
All that said, I would use a ListView. My general concept (the one I'd probably use) would be like this:
You have your data source, and use a Loader/LoaderManager/etc. to fill that into a Cursor. I'd feed this cursor to a CursorAdapter (perhaps a SimpleCursorAdapter, which seems likely and easy by looking at that UI concept --- won't need to customize the adapter part itself). Finally, this adapter would be used in the ListView. This is fairly easy and won't take much code (the ListView-SimpleCursorAdapter-Cursor stuff, the data logic is certainly custom).
You can then manage each of your clicks using the proper ListView listeners, IIRC. And act accordingly depending on the item selected. I'm guessing that the user would, for example, startActivity to see a detail about each medication.
However, as I said, if you have a fixed number of medications (here says an experienced former leukemia patient here, so I always assume medications vary widely!), a single TableLayout would do, but I feel that's not the case.
Ah, and about the layout for each component/med, as I said, a simple layout would do. Probably a LinearLayout with horizontal orientation. Again, very simple to implement with a SimpleCursorAdapter.
There's a nice example of how to do this with a custom row view here. This is probably the cleanest way to go.
The closest built-in widget for this is a TableLayout. Take a look at the Hello Views tutorial project for an example of this in action. You might want to wrap it in a ScrollView.
The right approach is highly dependent on the requirements. As I see it, you have (at least) a few options:
TableLayout
ListView
Something custom
As David noted, the TableLayout is most appropriate if you have a fixed set of data, but you can make it work dynamically too simply by adding child views. The benefit of using the TableLayout is mainly a built-in implementation of columns, including dynamic column sizing based on contents. The down-side is the lack of built-in dynamic support, especially when working with large data sets.
A ListView is a better fit for dynamic and large data sets, but comes with the limitation of not supporting columns. Ted's link lets you simulate columns, but unlike TableLayout these columns have a fixed width (in percentage of the parent's width). The columns are not sized based on content. You could potentially try to do something to measure all the children, but it'd be tricky. It can also be mildly annoying to try to deal with headers in a ListView, though with a little searching you'll find plenty of resources to help you with this.
The third option is to roll your own AdapterView or AbsListView. Of course this involves a significant amount more work, but you could take a look at how TableLayout works and resize the columns based on the content. This would also get you support for adapters and all the benefits that come along with that. This is probably quite a bit of work though, especially resizing the columns based on content.
Consider whether your columns must resize to fit their content or not.

Text layout across different columns

I wonder if there is some library I have missed that allows me to distribute text among different text objects and have it reflow depending on size, newspaper style? it's something pretty easily done in web but I can't find anything like it on Java for Android.
I don't know of any Android Layouts that work that way. You could probably create one that mimics the way html and css work though.
another option is to make your content with the Web technologies that you are used to and just display it inside of a WebView in your application. That would likely be a lot easier than trying to create the Layout yourself.
I had two text fields of different size and different default justification plus offset from the screen border. I simply overlapped them in the same space. Depending on what needed to be displayed, I would null out one field and fill in the other. It kept me from creating 2 different layouts and having to get creative with the text formatting.

How do I make a RichTextArea in Google Web Toolkit(GWT) Selectable/Highlight-able by a mouse but not Editable/Modifiable?

I'm currently making a GWT project where I display some HTML in a RichTextArea, and I want the RichTextArea to be selectable/highlight-able by a mouse but NOT be editable/modifiable by the user. In addition to this question, could you also tell me how to retrieve some highlighted text in string from without me having to add a text-background toolbar, which, after highlighting a text from the RichTextArea, you change the color of the text-background, upon which, you add a separate periodically looping thread which checks to see when the text-background changes substantially from white (or a native color of the webpage) and finally extracting the string whose text-background color differs as the selected text.
I really hate to give any pointers without explanation but i think your requirements are bigger ::: so --->
http://examples.roughian.com/index.htm#Widgets~RichTextArea
http://www.java2s.com/Code/Java/GWT/RichTextArea.htm

Categories