# Bar (lv_bar) (/widgets/bar) Overview [#overview] The Bar Widget has a background and an indicator. The length of the indicator against the background indicates the Bar's current value. Both the start and end values of the Bar can be set. Changing the start value to a value other than the minimum value in its range adjusts the start position of the indicator. Parts and Styles [#parts-and-styles] * The Bar's background. It uses the [typical background style properties](/common-widget-features/styles/overview). Adding padding makes the indicator smaller or larger. The `anim_time` style property sets the animation time if the values set with . * The Bar's indicator; also uses the [typical background style properties](/common-widget-features/styles/overview). Usage [#usage] Orientation and size [#orientation-and-size] * for orientation, width and height, simply set width and height style properties; * to override orientation caused by `width` and `height`. Valid values for `orientation` are: * * * Value and range [#value-and-range] A new value can be set with . The value is interpreted in a range (minimum and maximum values) which can be modified with . The default range is 0..100, and the default drawing direction is from left to right in horizontal mode and bottom to top in vertical mode. If the minimum value is greater than the maximum value, like 100..0, the drawing direction is reversed. The new value in can be set with or without an animation depending on the last parameter (`LV_ANIM_ON/OFF`). Modes [#modes] The Bar can be one of the following modes: * A normal Bar as described above * Draws indicator from zero value to current value. Requires a negative minimum value and positive maximum value, e.g. \[-100..100]. * Allows setting the start value as well with . The start value must be smaller than the end value. Data binding [#data-binding] To get familiar with observers, subjects, and data bindings in general visit the [Observer](/main-modules/observer/observer) page. This method of subscribing to an integer Subject affects a Bar Widget's integer value directly. Note that this is a one-way binding (Subject ==> Widget) so when the subject changes the Bar will be updated too. It supports integer and float subjects. * Events [#events] No special events are sent by Bar Widgets. Learn more about [Events](/common-widget-features/events) emitted by all Widgets. Learn more about [events](/common-widget-features/events). Keys [#keys] No *Keys* are processed by Bar Widgets. Learn more about [Keys](/main-modules/indev/keypad). Examples [#examples] Simple Bar [#simple-bar] Styling a bar [#styling-a-bar] Temperature meter [#temperature-meter] Stripe pattern and range value [#stripe-pattern-and-range-value] Bar with LTR and RTL base direction [#bar-with-ltr-and-rtl-base-direction] Custom drawer to show the current value [#custom-drawer-to-show-the-current-value] Bar with opposite direction [#bar-with-opposite-direction] API [#api]