In the latest scope widget, there is a new content sharing widget. We can use this widget to share our images to information, facebook,twitter and other channels. For example, in our scope preview, click the Share button on the image to share our content.
Its design is also very simple and clear.
We're still downloading the code from the exercises we've done:
$ git clone https://github.com/liu-xiao-guo/scopetemplates_comment_input
1) Add a new picture resource
Query.cpp
void Query::p ushresult (sc::searchreplyproxy const& reply, const string renderer, int i) {str Ingstream SS; SS << I; String str = SS.STR (); Auto cat = reply->register_category ("id" + str, "Template" + str, "", SC::CA Tegoryrenderer (renderer)); Sc::categorisedresult R (CAT); R.set_uri (Uri.tostdstring ()); R.set_art (Images_[0].tostdstring ());//R.set_art ("Http://api.map.baidu.com/images/weather/night/leizhenyu.png") ; r["subtitle"] = "subtitle" + str; R.set_title ("title" + str); r["Summary"] = "Summary:" + str; r["Fulldesc"] = "FULLDESC:" + str; r["mascot"] = Icons_[0].tostdstring (); r["emblem"] = icons_[1].tostdstring (); r["background"] = background_.tostdstring (); r["Overlay-color"] = "#FF0000"; r["Comment_icon"] = icons_[3].tostdstring (); r["Share_icon"] = icons_[4].tostdstring (); r["share_pic"] = icons_[5].tostdstring (); QString likes = QString("%1%2"). Arg (Qstr (U8 "\u261d"), "100"); QString views = QString ("%1%2"). Arg (Qstr (U8 "\u261f"), "99"); std::string both = Qstr ("%1%2"). Arg (likes,views). tostdstring (); Sc::variantbuilder Builder; Builder.add_tuple ({{"Value", Variant (both)}}); Builder.add_tuple ({{"Value", Variant ("")}}); r["attributes"] = Builder.end (); r["Musicsource"] = "http://qqmp3.djwma.com/mp3/magic sound God according to the need for Sihuo the saw pulled the eardrum will be broken." MP3 "; r["VideoSource"] = "http://techslides.com/demos/sample-videos/small.mp4"; r["screenshot"] = Icons_[2].tostdstring (); Add an array to show the gallary of it sc::variantarray arr; for (const auto &datum:icons_) {arr.push_back (Variant (datum.tostdstring ())); } r["Array"] = Sc::variant (arr); if (!reply->push (r)) return;} void Query::p ushresult (sc::searchreplyproxy const& reply, const std::shared_ptr<const Categor y> *cat, int i) {StringStream ss; SS << I; String str = SS.STR (); Sc::categorisedresult R (*cat); R.set_uri (Uri.tostdstring ()); R.set_art (Images_[i].tostdstring ()); r["subtitle"] = "subtitle" + str; R.set_title ("title" + str); r["Summary"] = "Summary:" + str; r["Fulldesc"] = "FULLDESC:" + str; r["mascot"] = Icons_[0].tostdstring (); r["emblem"] = icons_[1].tostdstring (); r["Comment_icon"] = icons_[3].tostdstring (); r["Share_icon"] = icons_[4].tostdstring (); r["share_pic"] = icons_[5].tostdstring (); QString likes = QString ("%1%2"). Arg (Qstr (U8 "\u261d"), "100"); QString views = QString ("%1%2"). Arg (Qstr (U8 "\u261f"), "99"); std::string both = Qstr ("%1%2"). Arg (likes,views). tostdstring (); Sc::variantbuilder Builder; Builder.add_tuple ({{"Value", Variant (both)}}); Builder.add_tuple ({{"Value", Variant ("")}}); r["attributes"] = Builder.end (); r["Musicsource"] = ""; r["VideoSource"] = ""; r["screenshot"] = ""; This was to ensure thePreview can well for the grid/carousel/lists ... Variantarray arr; r["array"] = Sc::variant (arr);; if (!reply->push (r)) return;}
We have added two new images above:
r["Share_icon"] = icons_[4].tostdstring (); r["share_pic"] = icons_[5].tostdstring ();
Note that the "Share_icon" here is the picture shown in the preview window. It can be different from the photos we actually share. What really defines in "Share_pic" is the picture we want to share. In the actual application, the shared picture can also be an array. Ask the developer to refer to our documentation to practice.
2) Add our widgets to preview
Preview.cpp
void Preview::run (SC::P reviewreplyproxy const& Reply) {result result = Previewquerybase::result (); Columnlayout Layout1col (1); std::vector<std::string> ids = {"Image", "header", "Summary", "tracks", "Videos" , "Gallery_header", "Gallerys", "Reviews", "exp", "Review_input", "Rating_input", "INP Utid "," img "};//std::vector<std::string> ids = {" inputID "," IMG "}; Previewwidgetlist widgets; Columnlayout Layout2col (2); Layout2col.add_column (IDS); Layout2col.add_column ({}); Columnlayout Layout3col (3); Layout3col.add_column (IDS); Layout3col.add_column ({}); Layout3col.add_column ({}); Define the header section SC::P reviewwidget Header ("header", "header"); It has title and a subtitle properties header.add_attribute_mapping ("title", "title"); Header.add_attribute_mapping ("subtitle", "subtitle"); Widgets.emplace_back (header); Define the image SEction SC::P reviewwidget image ("image", "image"); Mapped to the result's art property image.add_attribute_mapping ("source", "art"); Widgets.emplace_back (image); Define the Summary section SC::P reviewwidget Description ("Summary", "text"); It has a Text property, mapped to the result ' s Description property description.add_attribute_mapping ("text", "Descr Iption "); Widgets.emplace_back (description); Previewwidget Listen ("tracks", "Audio"); {Variantbuilder Builder; Builder.add_tuple ({{"title", Variant ("This is the song title")}, {"Source", Variant (result["MUSICSO Urce "].get_string (). C_STR ())}); Listen.add_attribute_value ("Tracks", Builder.end ()); } previewwidget Video ("Videos", "video"); Video.add_attribute_value ("Source", Variant (result["VideoSource"].get_string (). C_STR ())); Video.add_attribute_value ("screenshot", Variant (result["screenshot"].get_string (). C_STR ())); Previewwidget Header_gal ("Gallery_header", "header"); Header_gal.add_attribute_value ("title", Variant ("Gallery files are:")); Previewwidget Gallery ("Gallerys", "Gallery"); Gallery.add_attribute_mapping ("Sources", "array"); if (result["Musicsource"].get_string (). Length ()! = 0) {widgets.emplace_back (listen); } if (result["VideoSource"].get_string (). Length ()! = 0) {widgets.emplace_back (video); } if (result["array"].get_array (). Size ()! = 0) {widgets.emplace_back (Header_gal); Widgets.emplace_back (gallery); }//The following shows the review Previewwidget review ("reviews", "reviews"); Variantbuilder Builder; Builder.add_tuple ({{"Author", Variant ("John Doe")}, {"Review", Variant ( "Very good")}, {"rating", Variant (3.5)}); Builder.add_tuple ({{"Author", Variant ("Mr Smith")}, {"Review", Variant ("Very poor")}, {"rating", Variant (5)} }); Review.add_attribute_value ("Reviews", Builder.end ()); Widgets.emplace_back (review); The following shows the expandable Previewwidget expandable ("exp", "expandable"); Expandable.add_attribute_value ("title", Variant ("This was an expandable widget")); Expandable.add_attribute_value ("Collapsed-widgets", Variant (1)); Previewwidget W1 ("W1", "text"); W1.add_attribute_value ("title", Variant ("Subwidget 1")); W1.add_attribute_value ("Text", Variant ("A text")); Previewwidget W2 ("W2", "text"); W2.add_attribute_value ("title", Variant ("Subwidget 2")); W2.add_attribute_value ("Text", Variant ("A text")); Expandable.add_widget (W1); Expandable.add_widget (W2); Widgets.emplace_back (expandable); The following shows a review rating-input previewwidget W_review ("Review_input", "rating-input"); W_review.add_attribute_value ("SuBmit-label ", Variant (" Send ")); W_review.add_attribute_value ("Visible", Variant ("Review")); W_review.add_attribute_value ("Required", Variant ("Review")); std::string Reply_label = "Reply"; std::string Max_chars_label = "characters max"; W_review.add_attribute_value ("Review-label", Variant (Reply_label + ":" + Max_chars_label)); Widgets.emplace_back (W_review); The follwing shows a rating rating-input previewwidget w_rating ("Rating_input", "rating-input"); W_rating.add_attribute_value ("Visible", Variant ("rating")); W_rating.add_attribute_value ("Required", Variant ("rating")); W_rating.add_attribute_value ("Rating-label", Variant ("please"); Widgets.emplace_back (w_rating); Previewwidget w_image ("img", "image"); W_image.add_attribute_value ("Source", Variant (result["Share_icon"].get_string (). C_STR ())); Variantmap share_data;//share_data["uri"] = Variant ("http://img2.imgtn.bdimg.com/it/u=442803940,143587648&fm= 21&gp=0.jpg "); share_data["uri"] = Variant (result["Share_pic"].get_string (). C_STR ()); share_data["Content-type"] = Variant ("pictures"); W_image.add_attribute_value ("Share-data", Sc::variant (Share_data)); Widgets.emplace_back (W_image); Previewwidget w_commentinput ("inputID", "comment-input"); W_commentinput.add_attribute_value ("Submit-label", Variant ("Post")); Widgets.emplace_back (W_commentinput); In the following, fake some comments data qlist<comment> comment_list; std::string comment_str = "comment"; for (int i = 0; i < 3; i++) {Comment Comment; Comment.id = 1.0; Comment.publishtime = "2015-3-18"; Comment.text = Comment_str; Comment.text + = std::to_string (i+1); Comment_list.append (comment); } int index = 0; Q_foreach (const Auto & comment, comment_list) {std::string id = "Commentid_" + std::to_string (index++); Ids.emplace_back (ID); Previewwidget w_comment (id, "commeNT "); W_comment.add_attribute_value ("comment", Variant (Comment.text)); W_comment.add_attribute_value ("Author", Variant ("author")); W_comment.add_attribute_value ("Source", Variant (result["Comment_icon"].get_string (). C_STR ())); W_comment.add_attribute_value ("subtitle", Variant (Comment.publishtime)); Widgets.emplace_back (w_comment); } layout1col.add_column (IDs); Reply->register_layout ({layout1col, Layout2col, layout3col}); Reply->push (widgets);}
In the code above, we have added
Previewwidget w_image ("img", "image"); W_image.add_attribute_value ("Source", Variant (result["Share_icon"].get_string (). C_STR ())); Variantmap share_data;// share_data["uri"] = Variant ("http://img2.imgtn.bdimg.com/it/u=442803940,143587648 &fm=21&gp=0.jpg "); share_data["uri"] = Variant (result["Share_pic"].get_string (). C_STR ()); share_data["Content-type"] = Variant ("pictures"); W_image.add_attribute_value ("Share-data", sc::variant (Share_data)); Widgets.emplace_back (W_image);
At the same time, we also added the new IMG ID in the following IDs:
std::vector<std::string> ids = {"Image", "header", "Summary", "tracks", "videos", "Gallery_header", " Gallerys "," Reviews "," exp ", " Review_input "," Rating_input "," inputID "," IMG "};
In this way, when our photos are displayed, a shared button appears at the bottom left of the picture.
Click on our button to share the photos we defined in "Share_pic" above. This photo can also be a photo on the web.
The source code of the whole project is: https://github.com/liu-xiao-guo/scopetemplates_content_sharing
Use the content sharing widget at scope to share