UI
189 bites tagged UI — interview questions with model answers, and 60-second explainers.
VectorDrawable: Scalable Graphics for Android
A VectorDrawable is like an SVG for your app, defining images with math, not pixels. Use it for icons that need to look sharp on any screen without bloating your APK. The footgun: complex vectors can be slower to render than a comparable bitmap.
ViewBinding: Say Goodbye to findViewById
ViewBinding generates a type-safe class from your XML layout, giving you direct, non-null access to views with IDs. It's a compile-time safe replacement for `findViewById` used in Activities and Fragments. If a view is missing, you forgot to give it an ID.
UI Automator: Black-Box UI Testing for Android
Think of UI Automator as a robot that tests your app by looking at the screen, not your code. It's for end-to-end tests that cross app boundaries, like interacting with the system Settings. The footgun: tests are powerful but can be slow and brittle.
Espresso for Android UI Testing
Espresso is an Android framework for automated UI tests. As an instrumented test, it runs on a device or emulator to simulate user interactions, helping you verify app behavior and UI correctness as part of a complete testing strategy.
Android's UI Layer: Displaying Data, Handling Events
The UI layer is what users see and touch. It displays app data on screen and sends user input like taps to your business logic. It's used in every screen, from login forms to media players.
Theming in Compose: Style from a Single Source
Theming in Compose is like a CSS stylesheet for your app. You define colors, typography, and shapes once in a central `Theme` composable, and it cascades down. Use it for light/dark modes and brand consistency.
Lazy Layouts: Compose's Answer to Efficient Lists
Lazy layouts in Jetpack Compose render only the list items visible on screen, avoiding memory crashes from large datasets. Use them for long lists like feeds or galleries, but remember to provide a `key` to prevent UI glitches when data changes.
State in Jetpack Compose: The UI's Memory
In Compose, state is any value that can change over time. The UI is a direct function of this state; when the state updates, the UI automatically redraws (recomposes) to match. The main footgun is not "hoisting" state, which makes components hard to test.
Jetpack Compose Modifiers: Styling Your UI
Think of Modifiers as a chain of instructions that style and add behavior to your UI components. They're used for everything from setting padding and size to handling clicks.
Compose Layouts: Build UI by Describing It
Describe your UI, and Compose draws it. Use `Column` and `Row` to position elements, then augment them with modifiers. The footgun is coding before you've broken the visual design into reusable parts, leading to a tangled mess.
Composable Functions: Building UI with Kotlin Functions
Composable functions are Kotlin functions that describe your UI. Instead of creating View objects, you call functions like `Text` to build a UI tree. They are the core of Jetpack Compose for building Android UIs declaratively.
Android View Animation: A Blueprint for Motion
Think of Android's view-based animations as a pre-written score. You define the animation (the "score") in an XML file, then apply it to a View (the "instrument") in your code. This is used for animating properties like alpha or translation on UI elements.
MotionLayout: Animate Layouts with States, Not Code
MotionLayout animates layouts by describing start and end states in XML, letting the system handle the transition. Use it for complex UI choreography, like a collapsing toolbar, or to link animation progress to a user's swipe.
Data Binding: Link Android UI to Data in XML
Data Binding lets you connect UI components to data sources directly in XML, eliminating manual `findViewById` calls. It's used to set view properties based on your ViewModel's state.
Android Styles and Themes: UI Consistency at Scale
A Style is a collection of attributes for a single View, like a button's font and color. A Theme is a style applied to an entire Activity or application, providing a consistent look and feel. They are essential for managing UI appearance efficiently.
RecyclerView: Efficiently Displaying Dynamic Lists
RecyclerView displays long lists by recycling views that scroll off-screen, like a restaurant reusing plates for new customers. It's essential for feeds or contact lists.
ConstraintLayout: Flexible UIs Without Nesting
ConstraintLayout positions UI elements by their relationships, like anchoring objects on a blueprint. It's ideal for responsive screens that avoid deep, slow view hierarchies.
Handling Android UI Events: Listeners and Callbacks
Think of UI event handling as setting tripwires. You attach a "listener" object to a UI element, and when a user interacts with it, your listener's code (the "callback") is triggered. This is how you make buttons and lists interactive.
View and ViewGroup: The Building Blocks of Android UI
A View is a single UI widget like a button; a ViewGroup is a container that arranges them. This is the fundamental structure for all Android UIs. The common footgun is creating deeply nested ViewGroups, which slows down rendering performance.
Android Activity: A Single Screen in Your App
An Android Activity is the window for a single screen in your app where users interact with your UI. The OS manages a "back stack" of Activities; starting a new screen pushes one on, and pressing back pops it off.
Layout Inspector: Debug Your UI Hierarchy
Layout Inspector is an X-ray for your app's UI, rendering a live 3D model of your component tree. Use it to debug visual glitches or find performance bottlenecks from deep layouts. The footgun is forgetting it has live updates to catch bugs during animations.
Get UI bites daily.
Five a day, five minutes, offline. With quizzes so it sticks.
Open testing — you’ll join as an early tester.