tv_channel_widget 0.0.1
tv_channel_widget: ^0.0.1 copied to clipboard
ChannelWidget is inspired by Amazon Prime / Jio Tv and fully developed in dart with ❤️ from scratch. Supports all the platfrom.
ChannelWidget 📺 #
ChannelWidget is an elegant and easy-to-use package for displaying a list of TV channels and their corresponding shows. Inspired by popular streaming services like Amazon Prime and Jio Tv, this package is fully developed in dart with ❤️ and supports all platforms. With its customizability and layout options, ChannelWidget gives you complete control over the look and feel of your app.
| Without Auto Detect Time | With Auto Detect Time |
|---|---|
Features 🚀 #
- Displays a list of TV channels and their corresponding shows.
- Fully customizable appearance using ChannelBuilder and ShowBuilder callbacks.
- Option to show the time above the widget.
- Option to move the widget to the current date and time.
- Customizable layout options such as header width, item height, vertical padding, and timer row height.
- Option to disable horizontal scrolling.
Installation 🔧 #
Add tv_widget as a dependency in your pubspec.yaml file
dependencies:
tv_channel_widget: '^0.0.1'
You should then run flutter packages get in your terminal so as to get the package.
Import Channel Widget :
import 'package:tv_channel_widget/tv_channel_widget.dart';
Usage 🎬 #
Create List with TvChannel class
First, create a list of TvChannel objects and their corresponding ShowItems:
showsList = [
TvChannel
(
channelName: '
Discovery+
'
,
showItems: [
ShowItem
(
showName: '
Gold Rush
'
,
showStartTime: DateTime
(2023, 1, 6, 00, 0),
showEndTime: DateTime
(2023, 1, 6, 1, 0)),
ShowItem
(
showName: '
Food Factory
'
,
showStartTime: DateTime
(2023, 1, 6, 1, 0),
showEndTime: DateTime
(2023, 1, 6, 1, 30)),
ShowItem
(
showName: '
Miso Huge
'
,
showStartTime: DateTime
(2023, 1, 6, 1, 30),
showEndTime: DateTime
(2023, 1, 6, 2, 30)),
ShowItem
(
showName: '
Race of Life
'
,
showStartTime: DateTime
(2023, 1, 6, 2, 30),
showEndTime: DateTime
(2023, 1, 6, 3, 0)),
ShowItem
(
showName: '
Impossible
'
,
showStartTime: DateTime
(2023, 1, 6, 3, 0),
showEndTime: DateTime
(2023, 1, 6, 5, 0)),
ShowItem
(
showName: '
BPL
'
,
showStartTime: DateTime
(2023, 1, 6, 5, 0),
showEndTime: DateTime
(2023, 1, 6, 7, 0)),
ShowItem
(
showName: '
Contact
'
,
showStartTime: DateTime
(2023, 1, 6, 7, 0),
showEndTime: DateTime
(2023, 1, 6, 9, 0)),
ShowItem
(
showName: '
Gold Rush The Movie
'
,
showStartTime: DateTime
(2023, 1, 6, 9, 0),
showEndTime: DateTime
(2023, 1, 6, 12, 0)),
ShowItem
(
showName: '
Gold Rush The Movie
'
,
showStartTime: DateTime
(2023, 1, 6, 12, 0),
showEndTime: DateTime
(2023, 1, 6, 13, 0)),
ShowItem
(
showName: '
Gold Rush The Movie Two
'
,
showStartTime: DateTime
(2023, 1, 6, 13, 0),
showEndTime: DateTime
(2023, 1, 6, 15, 0)),
ShowItem
(
showName: '
Gold Rush The Movie Three
'
,
showStartTime: DateTime
(2023, 1, 6, 15, 0),
showEndTime: DateTime
(2023, 1, 6, 18, 0)),
ShowItem
(
showName: '
Gold Rush The Movie Three
'
,
showStartTime: DateTime
(2023, 1, 6, 18, 0),
showEndTime: DateTime
(2023, 1, 6, 19, 0)),
ShowItem
(
showName: '
Gold Rush The Movie Three
'
,
showStartTime: DateTime
(2023, 1, 6, 19, 0),
showEndTime: DateTime
(2023, 1, 6, 21, 0)),
ShowItem
(
showName: '
Gold Rush The Movie Three
'
,
showStartTime: DateTime
(2023, 1, 6, 21, 0),
showEndTime: DateTime
(2023, 1, 6, 21, 30)),
ShowItem
(
showName: '
Gold Rush Five
'
,
showStartTime: DateTime
(2023, 1, 6, 21, 30),
showEndTime: DateTime
(2023, 1, 6, 23, 59)),
]
)
,
]
Create ChannelWidget
Then, use the ChannelWidget to display the list of channels and shows:
ChannelWidget
(
showsList: showsList,channelBuilder: (
channel) {
// Customize the appearance of the channel header
},
showBuilder: (
channel, show) {
// Customize the appearance of the show items
}
)
Parameters explained:
-
channelBuilder:- This is a widget builder for Channel you can customzie it how every you want.For channelBuilder widget it will take headerWidth value. -
showsBuilder:- This is a widget builder forC channel Shows, you can see shows in horizontal view with it's particuler channel.
For further usage refer
the example available.
Documentation #
ChannelWidget Widget #
| Dart attribute | Datatype | Description | Default Value |
|---|---|---|---|
| channelShows | List<TvChannel> | List of channel with there shows. | (required) |
| channelBuilder | Widget | widget to display for each channel item. | (required) |
| showsBuilder | Widget | widget to display for each show item. | (required) |
| showTime | bool | whether to show the time above the widget. | true |
| moveToCurrentTime | bool | determines whether to move the widget to the current date and time. | true |
| disableHorizontalScroll | bool | determines the scroll behavior for horizontal scrolling. | false |
| headerWidth | double | determines whether to move the widget to the current date and time. | 150 |
| itemHeight | double | determines height of channel and shows item. | 100 |
| timerRowHeight | double | determines height of timer. | 10 |
| verticalPadding | double | vertical padding to channel and shows item | 20 |
For help on editing package code, view the flutter documentation.
Bugs or Requests #
If you encounter any problems feel free to open an issue. If you feel the library is missing a feature, please raise a ticket on GitHub and I'll look into it. Pull request are also welcome.
Contributors 💻 #
Jigar Fumakiya - Linkedin | Github
If you found this package helpful, give it a 👍 on pub.dev and a ⭐ on GitHub Your support is greatly appreciated! 🙏🎉 🙏 #
License #
ChannelWidget is licensed under MIT license.